/* Admin panel - builds on dashboard.css */
.admin-pill{font-size:0.66rem;font-weight:800;letter-spacing:0.1em;color:#fbbf24;background:rgba(245,158,11,0.12);border:1px solid rgba(245,158,11,0.3);padding:0.25rem 0.6rem;border-radius:999px}
.toolbar{display:flex;gap:0.7rem;margin-bottom:1rem;flex-wrap:wrap}
.toolbar .input{flex:1;min-width:200px}
.toolbar .select{flex:0 0 auto;min-width:180px;width:auto}
.select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#888 50%),linear-gradient(135deg,#888 50%,transparent 50%);background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:2rem;cursor:pointer}
.select option{background:#141414;color:#fff}
textarea.input{resize:vertical;min-height:80px;font-family:inherit;line-height:1.5}
tbody tr.clickable{cursor:pointer}
.u-cell b{display:block;color:var(--text);font-weight:700}
.u-cell span{font-size:0.76rem;color:var(--muted)}
.tag{display:inline-block;font-size:0.62rem;font-weight:800;letter-spacing:0.06em;padding:0.1rem 0.4rem;border-radius:5px;margin-left:0.35rem;vertical-align:1px}
.tag.admin{background:rgba(245,158,11,0.15);color:#fbbf24}
.tag.system{background:rgba(96,165,250,0.15);color:#93c5fd}
.badge.connected,.badge.active{background:rgba(34,197,94,0.15);color:var(--green)}
.badge.none{background:rgba(255,255,255,0.06);color:var(--muted)}
.badge.needs_reconnect{background:rgba(245,158,11,0.15);color:var(--amber)}
.badge.blocked{background:rgba(239,68,68,0.12);color:var(--red)}
.pager{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.8rem 1.2rem;border-top:1px solid var(--line);font-size:0.8rem;color:var(--muted)}
.pager:empty{display:none}

/* Chart */
.chart{position:relative;height:240px}
.chart svg{width:100%;height:100%;display:block;overflow:visible}
.chart .grid{stroke:#262626;stroke-width:1}
.chart .axis-text{fill:#888;font-size:11px;font-family:inherit}
.chart .bar{fill:#16a34a}
.chart .hit{fill:transparent;cursor:pointer}
.chart .hit:hover + .bar,.chart .bar.hover{fill:#22c55e}
.chart-tip{position:absolute;pointer-events:none;background:#0a0a0a;border:1px solid #333;border-radius:10px;padding:0.55rem 0.75rem;font-size:0.76rem;color:#ddd;white-space:nowrap;transform:translate(-50%,-100%);box-shadow:0 10px 30px rgba(0,0,0,0.5);z-index:5}
.chart-tip b{color:#fff;display:block;margin-bottom:0.15rem}
.chart-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--muted);font-size:0.85rem}

/* Attention list */
.att{display:flex;align-items:center;gap:0.8rem;padding:0.8rem 0;border-bottom:1px solid var(--line);font-size:0.85rem}
.att:last-child{border:none}
.att .ic{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:0.9rem}
.att .ic.warn{background:rgba(245,158,11,0.12)}
.att .ic.ok{background:rgba(34,197,94,0.12)}
.att .ic.bad{background:rgba(239,68,68,0.12)}
.att > div:not(.ic){flex:1}
.att span{display:block;font-size:0.75rem;color:var(--muted)}

/* Drawer */
.drawer-bg{position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:300;backdrop-filter:blur(2px)}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);background:#0f0f0f;border-left:1px solid var(--line2);z-index:301;transform:translateX(100%);transition:transform .3s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column}
.drawer.open{transform:none}
.drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.3rem 1.4rem;border-bottom:1px solid var(--line)}
.drawer-title{font-size:1.05rem;font-weight:800}
.drawer-body{flex:1;overflow-y:auto;padding:1.2rem 1.4rem 2rem}
.kv{display:grid;grid-template-columns:130px 1fr;gap:0.5rem 1rem;font-size:0.83rem;margin-bottom:1.4rem}
.kv dt{color:var(--muted)}
.kv dd{color:var(--text2);word-break:break-all}
.d-section{font-size:0.7rem;font-weight:800;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted);margin:1.4rem 0 0.7rem}
.d-actions{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem}
.d-actions .btn{width:100%}
.mini-tx{display:flex;justify-content:space-between;gap:0.8rem;padding:0.55rem 0;border-bottom:1px solid var(--line);font-size:0.8rem}
.mini-tx:last-child{border:none}
.mini-tx span{color:var(--muted)}

/* Announcement */
.switch{display:inline-flex;align-items:center;gap:0.7rem;font-size:0.86rem;cursor:pointer;color:var(--text2)}
.switch input{display:none}
.switch span{width:40px;height:22px;border-radius:999px;background:#333;position:relative;transition:background .2s}
.switch span::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s}
.switch input:checked + span{background:var(--green)}
.switch input:checked + span::after{transform:translateX(18px)}

@media(max-width:860px){
  .toolbar .select{flex:1}
  .kv{grid-template-columns:100px 1fr}
  .d-actions{grid-template-columns:1fr}
}
