.info-modal .modal-body{max-height:70vh;overflow-y:auto}
/* Prevent the native text-selection handles/callout from popping up on tap —
   these are tappable UI chrome, not readable text, same convention as .message-wrapper in chat.css. */
.info-section-title,.link-btn,.empty-hint,.invite-link-row,.invite-link-code,.invite-link-meta,
.member-row,.member-name,.role-badge,.mute-badge,.member-actions-btn,.count-badge,.chevron,
.audit-row,.audit-time,.perm-row{
  user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;
}

.info-section{width:100%;text-align:left;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:14px;padding:12px 14px;margin-top:10px}
.info-section-title{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;font-weight:700;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.03em;margin-bottom:10px}
.section-label{display:flex;align-items:center;gap:6px}
.info-hint{font-size:12px;line-height:1.4;color:var(--text-secondary);opacity:.8}
.section-icon{font-size:14px;filter:saturate(1.2)}
.count-badge{background:var(--accent);color:#fff;font-size:11px;font-weight:700;padding:1px 7px;border-radius:9px;line-height:1.5}
.info-section-title.collapsible{cursor:pointer}
.chevron{color:var(--text-muted);font-size:13px;transition:transform .2s ease}
.chevron.open{transform:rotate(90deg)}

.link-btn{background:none;border:none;color:var(--accent);font-size:13px;font-weight:600;cursor:pointer;padding:4px 6px;border-radius:6px;transition:background .15s}
.link-btn:hover{background:rgba(176,110,243,.12)}
.link-btn.danger{color:var(--danger)}
.link-btn.danger:hover{background:rgba(239,68,68,.12)}
.empty-hint{color:var(--text-muted);font-size:13px;padding:6px 0}

.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;color:var(--text-primary);font-size:14px}
.toggle-row input[type="checkbox"]{width:40px;height:24px;appearance:none;background:var(--bg-secondary);border-radius:12px;position:relative;cursor:pointer;border:1px solid var(--border);transition:background .2s}
.toggle-row input[type="checkbox"]::before{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;background:var(--text-secondary);border-radius:50%;transition:transform .2s}
.toggle-row input[type="checkbox"]:checked{background:var(--accent)}
.toggle-row input[type="checkbox"]:checked::before{transform:translateX(16px);background:#fff}

.invite-link-row{background:var(--bg-secondary);border-left:3px solid var(--accent);border-radius:8px;padding:10px 12px;margin-bottom:8px}
.invite-link-row:last-child{margin-bottom:0}
.invite-link-code{font-family:monospace;font-size:13px;color:var(--accent);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.invite-link-meta{font-size:12px;color:var(--text-muted);margin-top:4px;display:flex;align-items:center;justify-content:space-between;gap:8px}

.member-rows{display:flex;flex-direction:column;gap:2px;max-height:260px;overflow-y:auto}
.member-row{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:10px;transition:background .15s}
.member-row:hover{background:rgba(176,110,243,.1)}
.member-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--bg-secondary);flex-shrink:0}
.avatar-fallback{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:#fff;font-weight:700;font-size:13px}
.member-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.member-name{font-size:14px;color:var(--text-primary);display:flex;align-items:center;gap:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.online-dot-inline{width:7px;height:7px;border-radius:50%;background:var(--success);flex-shrink:0;display:inline-block}
.role-badge{font-size:11px;font-weight:600;padding:1px 8px;border-radius:8px;width:fit-content}
.role-badge.role-owner{background:rgba(176,110,243,.2);color:var(--accent)}
.role-badge.role-admin{background:rgba(34,197,94,.15);color:var(--success)}
.mute-badge{font-size:12px}
.member-actions-btn{background:none;border:none;color:var(--text-muted);font-size:18px;padding:6px 10px;border-radius:8px;cursor:pointer;flex-shrink:0;transition:all .15s}
.member-actions-btn:hover{color:var(--text-primary);background:rgba(255,255,255,.06)}

.audit-rows{display:flex;flex-direction:column;gap:2px;max-height:220px;overflow-y:auto;margin-top:2px}
.audit-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 6px;font-size:13px;color:var(--text-primary);border-bottom:1px solid var(--border)}
.audit-row:last-child{border-bottom:none}
.audit-time{color:var(--text-muted);font-size:11px;white-space:nowrap;flex-shrink:0}

.perm-row{display:flex;align-items:center;gap:8px;padding:9px 16px;font-size:14px;color:var(--text-primary);cursor:pointer}
.perm-row:hover{background:var(--bg-tertiary)}
.perm-row input{width:16px;height:16px;flex-shrink:0}

@media(max-width:768px){
.info-modal{position:fixed;inset:0;width:100vw;max-width:100vw;height:100vh;height:100dvh;height:var(--app-height,100dvh);border-radius:0;border:none}
.info-modal .modal-body{max-height:calc(100vh - 80px);max-height:calc(var(--app-height,100vh) - 80px)}
.member-row,.member-actions-btn{min-height:44px}
}

/* ===== Shared media gallery in the info card ===== */
.info-media-tabs{display:flex;gap:4px;margin-bottom:10px}
.media-tab{flex:1;background:none;border:none;border-radius:9px;padding:7px 4px;color:var(--text-secondary);font-size:13px;font-weight:600;cursor:pointer;transition:background .15s,color .15s;font-family:inherit;user-select:none;-webkit-user-select:none}
.media-tab:hover{background:rgba(176,110,243,.1)}
.media-tab.active{background:var(--accent);color:#fff}
.info-media-content{max-height:300px;overflow-y:auto}
.info-media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.info-media-cell{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;cursor:pointer;background:var(--bg-secondary)}
.info-media-cell img,.info-media-cell video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s}
.info-media-cell:hover img,.info-media-cell:hover video{transform:scale(1.05)}
.cell-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;pointer-events:none}
.info-file-row{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:10px;cursor:pointer;transition:background .15s;text-align:left;user-select:none;-webkit-user-select:none}
.info-file-row:hover{background:rgba(176,110,243,.1)}
.info-file-row .file-icon{font-size:20px;flex-shrink:0}
.info-row-sub{font-size:11px;color:var(--text-muted)}
.info-voice-play{color:var(--accent);font-size:14px;flex-shrink:0}
.info-link-row{padding:8px 6px;border-bottom:1px solid var(--border);text-align:left;font-size:13px;word-break:break-all}
.info-link-row:last-child{border-bottom:none}
.info-link-row .msg-link{color:#a78bfa}