/* Believoo IO — premium blue-gold license hub theme */
:root{
  --bg:#04070f;--bg2:#070c1a;--card:rgba(16,24,48,.62);--card2:rgba(10,15,32,.55);
  --bd:rgba(148,163,255,.14);--bd2:rgba(148,163,255,.08);
  --tx:#dbe4ff;--mut:#8b99c7;
  --ac:#f5b942;--ac2:#d97706;--gold:#fbbf24;--blue:#3b82f6;--cyan:#38bdf8;
  --ok:#22c55e;--warn:#f59e0b;--bad:#ef4444;
}
*{box-sizing:border-box}
html{height:100%}
body{
  margin:0;min-height:100%;color:var(--tx);
  font:14px/1.55 Inter,system-ui,Segoe UI,sans-serif;
  background:
    radial-gradient(1100px 500px at 85% -10%,rgba(245,185,66,.07),transparent 60%),
    radial-gradient(900px 600px at -10% 110%,rgba(59,130,246,.10),transparent 60%),
    radial-gradient(700px 500px at 50% 50%,rgba(139,92,246,.05),transparent 65%),
    var(--bg);
}
body::before{ /* drifting orbs */
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(340px 340px at 12% 20%,rgba(59,130,246,.12),transparent 70%),
    radial-gradient(300px 300px at 88% 75%,rgba(245,185,66,.10),transparent 70%),
    radial-gradient(260px 260px at 60% 8%,rgba(56,189,248,.08),transparent 70%);
  animation:orbDrift 26s ease-in-out infinite alternate;
}
@keyframes orbDrift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(30px,-24px,0) scale(1.06)}}
a{color:var(--cyan);text-decoration:none}
a:hover{text-decoration:none;color:var(--gold)}

.wrap{display:flex;min-height:100vh}
.side{
  width:236px;flex-shrink:0;position:sticky;top:0;height:100vh;overflow-y:auto;
  background:linear-gradient(180deg,rgba(10,16,34,.92),rgba(6,10,22,.92));
  backdrop-filter:blur(18px);border-right:1px solid var(--bd);
  padding:20px 14px;display:flex;flex-direction:column;
}
.logo{display:flex;align-items:center;gap:12px;margin:2px 6px 22px}
.logo img{width:44px;height:44px;border-radius:12px;object-fit:cover;
  box-shadow:0 0 0 1px rgba(251,191,36,.35),0 6px 22px rgba(245,185,66,.25)}
.logo b{font:800 17px Inter;letter-spacing:.4px;color:#fff;display:block;line-height:1.1}
.logo b span{background:linear-gradient(90deg,#fde68a,#f59e0b);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo small{display:block;color:var(--mut);font-size:10.5px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;margin-top:2px}
.side a{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;
  color:var(--mut);margin-bottom:2px;font-weight:600;font-size:13.5px;
  border:1px solid transparent;transition:all .16s ease;
}
.side a svg{width:16px;height:16px;flex-shrink:0;opacity:.8}
.side a:hover{background:rgba(148,163,255,.07);color:#fff}
.side a.on{
  background:linear-gradient(90deg,rgba(245,185,66,.16),rgba(245,185,66,.05));
  border-color:rgba(245,185,66,.30);color:#fde68a;
  box-shadow:inset 3px 0 0 var(--gold),0 4px 16px rgba(245,185,66,.08);
}
.side a.on svg{opacity:1;color:var(--gold)}
.side .navsec{color:#5d6f9c;font-size:9.5px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase;margin:14px 8px 5px;padding-top:12px;border-top:1px solid var(--bd2)}
.side .navsec:first-of-type{border-top:0;padding-top:0;margin-top:8px}
.side .foot{margin-top:auto;padding-top:16px;border-top:1px solid var(--bd2);font-size:11px;color:var(--mut)}
.side a.logout{margin-top:4px;color:#f87171}
.side a.logout:hover{background:rgba(239,68,68,.08);color:#fca5a5}

.main{flex:1;padding:26px 30px;max-width:1280px}
h1{font-size:21px;margin:0 0 18px;font-weight:800;letter-spacing:-.2px;
  padding-left:12px;border-left:3px solid var(--gold)}
h1 .muted{border:0;padding:0}
h2{font-size:15px;margin:22px 0 10px;font-weight:700;color:#e8eeff}

.card{
  background:linear-gradient(180deg,var(--card),var(--card2));
  border:1px solid var(--bd);border-radius:16px;padding:18px;margin-bottom:16px;
  backdrop-filter:blur(14px);
  box-shadow:0 8px 32px rgba(2,6,18,.45),inset 0 1px 0 rgba(255,255,255,.04);
  transition:border-color .2s,box-shadow .2s,transform .2s;
}
.card:hover{border-color:rgba(148,163,255,.24)}
.grid{display:grid;gap:14px}
.g4{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.g2{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}
.stat{
  font-size:28px;font-weight:800;color:#fff;letter-spacing:-.5px;
  background:linear-gradient(135deg,#fff 30%,#9db6ff);-webkit-background-clip:text;background-clip:text;
}
.stat.gold{background:linear-gradient(135deg,#fde68a,#f59e0b);-webkit-background-clip:text;background-clip:text}
.lbl{color:var(--mut);font-size:10.5px;text-transform:uppercase;letter-spacing:1.2px;font-weight:700}

table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--bd2);vertical-align:top}
th{color:var(--mut);font-size:10.5px;text-transform:uppercase;letter-spacing:1.1px;font-weight:700;border-bottom:1px solid var(--bd)}
tr:hover td{background:rgba(148,163,255,.05)}
tr:last-child td{border-bottom:0}

input,select,textarea{
  width:100%;background:rgba(6,11,26,.8);border:1px solid var(--bd);color:var(--tx);
  padding:9px 12px;border-radius:10px;font:inherit;transition:border-color .15s,box-shadow .15s;
}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:rgba(251,191,36,.55);
  box-shadow:0 0 0 3px rgba(251,191,36,.14),0 0 18px rgba(251,191,36,.10);
}
label{display:block;color:var(--mut);font-size:12px;margin:8px 0 4px;font-weight:600}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row>*{flex:1;min-width:150px}

.btn{
  display:inline-flex;align-items:center;gap:6px;justify-content:center;
  background:linear-gradient(135deg,#fde68a 0%,#f59e0b 45%,#d97706 100%);
  color:#231803;border:0;padding:9px 18px;border-radius:10px;font-weight:800;cursor:pointer;font:inherit;font-size:13px;
  box-shadow:0 4px 18px rgba(245,158,11,.28),inset 0 1px 0 rgba(255,255,255,.45);
  transition:transform .15s,box-shadow .15s,filter .15s;position:relative;overflow:hidden;
}
.btn::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);transition:left .5s}
.btn:hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 8px 26px rgba(245,158,11,.38)}
.btn:hover::after{left:130%}
.btn.sm{padding:5px 12px;font-size:12px;border-radius:8px}
.btn.ghost{
  background:rgba(148,163,255,.08);border:1px solid var(--bd);color:var(--tx);font-weight:600;
  box-shadow:none;
}
.btn.ghost:hover{border-color:rgba(251,191,36,.4);color:#fde68a}
.btn.danger{
  background:rgba(239,68,68,.10);color:#fca5a5;border:1px solid rgba(239,68,68,.35);font-weight:600;box-shadow:none;
}
.btn.danger:hover{background:rgba(239,68,68,.18);color:#fecdd3}

.tag{display:inline-block;padding:2.5px 10px;border-radius:20px;font-size:10.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.t-ok{background:rgba(34,197,94,.12);color:#4ade80;border:1px solid rgba(34,197,94,.28)}
.t-bad{background:rgba(239,68,68,.12);color:#f87171;border:1px solid rgba(239,68,68,.30)}
.t-warn{background:rgba(245,158,11,.12);color:#fbbf24;border:1px solid rgba(245,158,11,.30)}
.t-info{background:rgba(56,189,248,.12);color:#7dd3fc;border:1px solid rgba(56,189,248,.28)}
.t-mut{background:rgba(148,163,255,.10);color:#a9b8e8;border:1px solid rgba(148,163,255,.20)}
.t-gold{background:rgba(251,191,36,.13);color:#fde68a;border:1px solid rgba(251,191,36,.35)}

.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;word-break:break-all}
td.mono{white-space:nowrap;word-break:normal}
.card{overflow-x:auto}
.card::-webkit-scrollbar{height:5px;width:5px}
.flash{background:rgba(34,197,94,.10);border:1px solid rgba(34,197,94,.35);color:#86efac;padding:11px 16px;border-radius:12px;margin-bottom:16px;font-weight:600}
.err{background:rgba(239,68,68,.10);border:1px solid rgba(239,68,68,.4);color:#fca5a5;padding:11px 16px;border-radius:12px;margin-bottom:16px;font-weight:600}
.muted{color:var(--mut)}
.copykey{display:flex;gap:8px;align-items:center}
.copykey input{flex:1}
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.top h1{margin:0}

/* ---------- auth / login ---------- */
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.auth .card{width:100%;max-width:400px;padding:36px 34px;text-align:left;position:relative;overflow:hidden}
.auth .card::before{content:"";position:absolute;inset:-1px;border-radius:16px;padding:1px;
  background:linear-gradient(135deg,rgba(251,191,36,.5),transparent 40%,rgba(59,130,246,.4));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.auth .logo{justify-content:center;margin:0 0 6px}
.auth .logo img{width:64px;height:64px;border-radius:16px;animation:floatLogo 4s ease-in-out infinite}
@keyframes floatLogo{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.auth h2{text-align:center;color:var(--mut);font-size:13px;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin:4px 0 24px}
.auth .btn{width:100%;padding:12px;margin-top:8px;font-size:14px}

@media(max-width:860px){.side{display:none}.main{padding:18px}}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(148,163,255,.18);border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:rgba(251,191,36,.35)}

/* ---------- theme toggle ---------- */
.tog{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:10px;
  color:var(--mut);background:none;border:1px solid transparent;font:inherit;font-weight:600;
  font-size:13.5px;cursor:pointer;margin-bottom:2px;transition:all .16s ease;text-align:left}
.tog:hover{background:rgba(148,163,255,.07);color:#fff}
.tog svg{width:16px;height:16px;flex-shrink:0;opacity:.8}

/* ---------- light theme ---------- */
html[data-theme="light"]{
  --bg:#eef1f9;--bg2:#ffffff;--card:rgba(255,255,255,.9);--card2:rgba(244,247,254,.92);
  --bd:rgba(88,110,180,.24);--bd2:rgba(88,110,180,.13);
  --tx:#1c2745;--mut:#5d6f9c;
}
html[data-theme="light"] body{background:
  radial-gradient(1100px 500px at 85% -10%,rgba(245,185,66,.10),transparent 60%),
  radial-gradient(900px 600px at -10% 110%,rgba(59,130,246,.10),transparent 60%),
  var(--bg)}
html[data-theme="light"] body::before{opacity:.4}
html[data-theme="light"] a{color:#0369a1}
html[data-theme="light"] a:hover{color:#b45309}
html[data-theme="light"] .side{background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(243,246,253,.94));
  border-right-color:#dde4f5}
html[data-theme="light"] .logo b{color:#101a36}
html[data-theme="light"] .side a{color:#4c5d8a}
html[data-theme="light"] .side a:hover{background:#eef2fd;color:#101a36}
html[data-theme="light"] .side a.on{background:linear-gradient(90deg,rgba(245,158,11,.14),rgba(245,158,11,.04));
  border-color:rgba(245,158,11,.4);color:#92650e}
html[data-theme="light"] .side a.on svg{color:#d97706}
html[data-theme="light"] .tog{color:#4c5d8a}
html[data-theme="light"] .tog:hover{background:#eef2fd;color:#101a36}
html[data-theme="light"] .side a.logout{color:#dc2626}
html[data-theme="light"] .side a.logout:hover{background:rgba(239,68,68,.07);color:#b91c1c}
html[data-theme="light"] h1{color:#101a36}
html[data-theme="light"] h2{color:#31406b}
html[data-theme="light"] .card{background:linear-gradient(180deg,var(--card),var(--card2));
  box-shadow:0 8px 26px rgba(60,80,140,.10),inset 0 1px 0 rgba(255,255,255,.7)}
html[data-theme="light"] .card:hover{border-color:rgba(88,110,180,.4)}
html[data-theme="light"] .stat{color:#101a36;background:none;-webkit-text-fill-color:currentColor}
html[data-theme="light"] .stat.gold{color:#b45309}
html[data-theme="light"] tr:hover td{background:rgba(245,158,11,.05)}
html[data-theme="light"] input,html[data-theme="light"] select,html[data-theme="light"] textarea{
  background:#f7f9ff;border-color:#cfdaf2;color:#1c2745}
html[data-theme="light"] input:focus,html[data-theme="light"] select:focus,html[data-theme="light"] textarea:focus{
  border-color:#d97706;box-shadow:0 0 0 3px rgba(245,158,11,.16)}
html[data-theme="light"] .btn.ghost{background:#fff;border-color:#cfdaf2;color:#31406b}
html[data-theme="light"] .btn.ghost:hover{border-color:#d97706;color:#92650e}
html[data-theme="light"] .btn.danger{background:#fff1f2;color:#be123c;border-color:#fecdd3}
html[data-theme="light"] .btn.danger:hover{background:#ffe4e6;color:#9f1239}
html[data-theme="light"] .t-ok{background:#e8f9ee;color:#15803d;border-color:#86efac}
html[data-theme="light"] .t-bad{background:#fee9eb;color:#dc2626;border-color:#fecaca}
html[data-theme="light"] .t-warn{background:#fef3d8;color:#b45309;border-color:#fcd9a0}
html[data-theme="light"] .t-info{background:#e3efff;color:#1d4ed8;border-color:#bfdbfe}
html[data-theme="light"] .t-mut{background:#edf1fc;color:#4c5d8a;border-color:#d9e1f5}
html[data-theme="light"] .t-gold{background:#fef3d8;color:#92650e;border-color:#f0cd85}
html[data-theme="light"] .flash{background:#e8f9ee;border-color:#86efac;color:#15803d}
html[data-theme="light"] .err{background:#fee9eb;border-color:#fca5a5;color:#b91c1c}
html[data-theme="light"] .auth .card{background:linear-gradient(180deg,#ffffff,#f6f8fe)}
html[data-theme="light"] ::-webkit-scrollbar-thumb{background:#c3cfec}
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover{background:#f59e0b}
html[data-theme="light"] ::selection{background:#f59e0b30}

/* fixed theme toggle for auth pages */
.togfix{position:fixed;top:16px;right:16px;z-index:50;display:flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:11px;border:1px solid rgba(251,191,36,.3);cursor:pointer;
  background:rgba(10,18,48,.8);color:#fbbf24;font:600 12px Inter;backdrop-filter:blur(10px);transition:all .2s}
.togfix:hover{border-color:#f59e0b;color:#fde68a}
.togfix svg{width:15px;height:15px}
html[data-theme="light"] .togfix{background:#fffffff0;border-color:#d5def3;color:#92650e}
html[data-theme="light"] .togfix:hover{border-color:#f59e0b;color:#b45309}