/* minichat admin — dashboard. Premium monoxrom (oq + qora). */
*{box-sizing:border-box;margin:0;padding:0}
:root{--av:#26262b;--line:rgba(255,255,255,.1);--muted:#7c7c82}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Inter,sans-serif;background:#000;color:#e8e8ec;-webkit-font-smoothing:antialiased}
a{cursor:pointer;text-decoration:none;color:inherit}
.logo{display:flex;align-items:center;gap:8px;font-size:19px;font-weight:700;letter-spacing:-.3px}
.logo .dot{width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 10px 1px rgba(255,255,255,.4)}
.logo b{color:#fff}
.logo .adm{font-size:11px;font-weight:700;color:#000;background:#fff;padding:2px 7px;border-radius:6px}

/* ---- gate ---- */
.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:#000}
.gate-card{max-width:380px;text-align:center;background:#0b0b0d;border:1px solid var(--line);border-radius:24px;padding:36px 28px}
.gate-card .logo{justify-content:center;margin-bottom:16px}
.gate-card p{color:#9a9aa2;font-size:14px;line-height:1.6;margin-bottom:20px}
.gate-card .btn{display:inline-block;background:#fff;color:#000;font-weight:700;padding:13px 22px;border-radius:13px}
.gate-card small{display:block;margin-top:14px;color:var(--muted);font-size:12px}

/* ---- layout ---- */
#app{display:flex;min-height:100vh}
.side{width:240px;flex:none;background:#070708;border-right:1px solid var(--line);display:flex;flex-direction:column;padding:20px 14px;position:sticky;top:0;height:100vh}
.side>.logo{padding:6px 8px 22px}
.side nav{display:flex;flex-direction:column;gap:3px;flex:1}
.side nav a{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:11px;color:#a6a6ad;font-size:14.5px;font-weight:500;transition:.15s}
.side nav a i{font-style:normal;font-size:17px;filter:grayscale(1) brightness(1.4)}
.side nav a:hover{background:rgba(255,255,255,.05);color:#fff}
.side nav a.on{background:rgba(255,255,255,.1);color:#fff;font-weight:600}
.side-foot{display:flex;flex-direction:column;gap:3px;border-top:1px solid var(--line);padding-top:12px}
.side-foot a{padding:9px 13px;border-radius:10px;color:var(--muted);font-size:13.5px}
.side-foot a:hover{background:rgba(255,255,255,.05);color:#fff}

main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:flex;align-items:center;gap:14px;padding:18px 26px;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(0,0,0,.85);backdrop-filter:blur(12px);z-index:20}
.top h1{font-size:20px;font-weight:700;flex:1}
.top .who{font-size:13.5px;color:#9a9aa2;background:rgba(255,255,255,.06);padding:7px 14px;border-radius:20px}
#menu-btn{display:none;background:none;border:0;color:#fff;font-size:22px;cursor:pointer}
#view{padding:26px;flex:1}

/* ---- stat kartalar ---- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin-bottom:10px}
.scard{background:#0c0c0e;border:1px solid var(--line);border-radius:18px;padding:20px}
.scard .k{font-size:13px;color:var(--muted);margin-bottom:8px;display:flex;align-items:center;gap:7px}
.scard .v{font-size:30px;font-weight:800;letter-spacing:-.5px}
.scard .d{font-size:12px;color:#fff;margin-top:5px;opacity:.8}
.scard.gold{background:#fff;color:#000;border-color:#fff}
.scard.gold .k,.scard.gold .d{color:#000;opacity:.7}

/* ---- jadval / ro'yxat ---- */
.bar{display:flex;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.bar input{flex:1;min-width:200px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:12px;padding:11px 15px;color:#fff;font-size:14px;outline:none}
.bar input:focus{border-color:rgba(255,255,255,.5)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;color:#6c6c75;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px;padding:10px 12px;border-bottom:1px solid var(--line)}
.tbl td{padding:12px;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:middle}
.tbl tr:hover td{background:rgba(255,255,255,.02)}
.u{display:flex;align-items:center;gap:10px}
.u img,.u .ava{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;background:var(--av);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700}
.u .nm{font-weight:600}.u .un{color:var(--muted);font-size:12.5px}
.badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;display:inline-block}
.badge.adm{background:#fff;color:#000}
.badge.ban{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.3)}
.badge.ok{background:rgba(255,255,255,.12);color:#fff}
.acts{display:flex;gap:6px;flex-wrap:wrap}
.btn-s{border:1px solid var(--line);background:rgba(255,255,255,.04);color:#d8d8dc;border-radius:9px;padding:6px 11px;font-size:12.5px;cursor:pointer;font-weight:600;transition:.15s}
.btn-s:hover{background:rgba(255,255,255,.1);color:#fff}
.btn-s.dang{border-color:rgba(255,255,255,.25)}
.btn-s.dang:hover{background:rgba(255,255,255,.15)}
.btn-s.gold{background:#fff;color:#000;border-color:#fff}
.btn-s.gold:hover{filter:brightness(.9)}
.grid-posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.pcard{background:#0c0c0e;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.pcard .thmb{width:100%;aspect-ratio:9/13;object-fit:cover;background:#000;display:block}
.pcard .pb{padding:10px}
.pcard .pm{font-size:12px;color:var(--muted);display:flex;justify-content:space-between;margin-top:6px}
.pager{display:flex;gap:8px;justify-content:center;margin-top:22px}
.pager button{background:rgba(255,255,255,.05);border:1px solid var(--line);color:#fff;border-radius:10px;padding:8px 16px;cursor:pointer}
.pager button[disabled]{opacity:.4;pointer-events:none}
.loading,.empty{text-align:center;padding:50px;color:#6c6c75}
.muted{color:var(--muted)}

#overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);display:none;z-index:40}
#overlay.on{display:block}

/* ---- mobil ---- */
@media(max-width:820px){
  .side{position:fixed;left:0;top:0;z-index:50;transform:translateX(-100%);transition:.25s;box-shadow:0 0 60px rgba(0,0,0,.6)}
  .side.open{transform:none}
  #menu-btn{display:block}
  #view{padding:16px}
  .top{padding:14px 16px}
  .tbl thead{display:none}
  .tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
  .tbl tr{background:#0c0c0e;border:1px solid var(--line);border-radius:14px;margin-bottom:12px;padding:8px}
  .tbl td{border:0;padding:7px 10px}
}
