/* ── Admin Users page — drawer, confirm dialog, user avatar ── */
.drawer-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:200; opacity:0; pointer-events:none; transition:opacity .2s; }
.drawer-overlay.open { opacity:1; pointer-events:all; }
.drawer { position:fixed; top:0; right:0; bottom:0; width:min(520px,100vw); background:var(--surface,#fff); box-shadow:-4px 0 32px rgba(0,0,0,.18); z-index:201; transform:translateX(100%); transition:transform .25s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; overflow:hidden; }
.drawer.open { transform:translateX(0); }
.drawer-header { padding:1.25rem 1.5rem; border-bottom:1px solid var(--border,#e5e0d8); display:flex; align-items:center; gap:.75rem; flex-shrink:0; }
.drawer-header h2 { margin:0; font-size:1.1rem; flex:1; }
.drawer-close { background:none; border:none; font-size:1.4rem; cursor:pointer; color:var(--text2,#888); padding:.25rem .5rem; border-radius:6px; line-height:1; }
.drawer-close:hover { background:var(--bg,#f9f7f4); color:var(--text1,#1a1a1a); }
.drawer-body { flex:1; overflow-y:auto; padding:1.5rem; }
.drawer-section { margin-bottom:1.75rem; }
.drawer-section-title { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--text2,#888); margin:0 0 .75rem; padding-bottom:.4rem; border-bottom:1px solid var(--border,#e5e0d8); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:.75rem; }
.form-row.full { grid-template-columns:1fr; }
.form-group { display:flex; flex-direction:column; gap:.3rem; }
.form-group label { font-size:.78rem; font-weight:600; color:var(--text2,#888); }
.danger-zone { border:1px solid #fca5a5; border-radius:8px; padding:1rem; background:#fff5f5; }
.danger-zone .drawer-section-title { color:#dc2626; border-color:#fca5a5; }
.danger-actions { display:flex; gap:.5rem; flex-wrap:wrap; }
.confirm-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:300; display:flex; align-items:center; justify-content:center; }
.confirm-dialog { background:var(--surface,#fff); border-radius:12px; padding:1.75rem; max-width:380px; width:90%; box-shadow:0 8px 40px rgba(0,0,0,.22); }
.confirm-dialog h3 { margin:0 0 .5rem; font-size:1rem; }
.confirm-dialog p { color:var(--text2,#888); font-size:.88rem; margin:0 0 1.25rem; }
.confirm-btns { display:flex; gap:.5rem; justify-content:flex-end; }
.user-avatar { width:40px; height:40px; border-radius:50%; background:var(--primary,#2d2d2d); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1rem; flex-shrink:0; overflow:hidden; }
.user-avatar img { width:100%; height:100%; object-fit:cover; }
.mini-post { display:flex; justify-content:space-between; align-items:center; padding:.45rem 0; border-bottom:1px solid var(--border,#e5e0d8); font-size:.82rem; }
.mini-post:last-child { border-bottom:none; }
.mini-post-title { font-weight:600; flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-right:.5rem; }
.info-pill { display:inline-flex; align-items:center; gap:.35rem; background:var(--bg,#f9f7f4); border:1px solid var(--border,#e5e0d8); border-radius:99px; padding:.2rem .65rem; font-size:.78rem; color:var(--text2,#888); }

/* Drawer is a light panel — override dark-theme globals so text is readable */
.drawer { color: #1a1a1a; }
.drawer-header h2 { color: #1a1a1a; }
.drawer .btn-outline { color: #1a1a1a; border-color: #c8c2bb; }
.drawer .btn-outline:hover { border-color: #555; color: #111; background: #f5f3f0; }