/* wwwroot/css/group-calls.css — добавь/обнови */

.gc-wrap {
    position: relative;
    width: 100%;
    height: calc(100vh - 120px);
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr auto; /* видео + (опц.) колонка участников */
    gap: 12px;
}

/* видео блок */
.gc-video {
    position: relative;
    width: 100%;
    height: 100%;
    background: #000;
    border-radius: 12px;
    overflow: hidden;
}

.gc-root { position: absolute; inset: 0; }

.gc-overlay {
    position: absolute; left:12px; top:12px; z-index:2; color:#fff;
    text-shadow: 0 1px 2px rgba(0,0,0,.7)
}
.gc-title { font-size: 20px; font-weight: 700 }
.gc-desc  { opacity: .85; font-size: 14px }
.gc-meta  { margin-top: 6px; display:flex; gap:12px; font-size:12px; opacity:.9 }

.gc-controls { position:absolute; left:12px; bottom:12px; z-index:3 }

/* правая колонка участников (для спикера) */
.gc-aside {
    width: 320px;
    max-width: 35vw;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
}
.gc-aside-head {
    padding: 10px 12px;
    border-bottom: 1px solid #eee;
    font-weight: 600;
    display:flex; align-items:center; justify-content:space-between;
}
.gc-aside-refresh {
    background: transparent; border:0; cursor:pointer; font-size:16px;
}
.gc-aside-body { padding: 8px 12px; overflow:auto; }
.gc-aside-body ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:6px; }
.gc-aside-body li { display:flex; align-items:center; gap:8px; }
.gc-aside-body .dot { width:8px; height:8px; border-radius:50%; background:#22c55e; display:inline-block; }
.gc-aside .dot{ display:inline-block; width:8px; height:8px; background:#16a34a; border-radius:50%; margin-right:6px; vertical-align:middle }

.gc-ghost { opacity:.6; font-size: 14px; }

/* чат — выезжающий, не тянет сетку */
.gc-chat {
    position: absolute; top:0; right:0; bottom:0;
    width: 380px; max-width: 92vw;
    background:#fff; border-left:1px solid #e5e7eb;
    display:flex; flex-direction:column;
    transform: translateX(100%); transition: transform .25s ease; z-index:5;
}
.gc-chat.open { transform: translateX(0); }
.gc-chat-head { padding:10px 12px; border-bottom:1px solid #eee; font-weight:600 }
.gc-chat-box { flex:1; overflow:auto; padding:12px }
.gc-chat-input { display:flex; gap:8px; padding:10px; border-top:1px solid #eee }
.gc-chat-input input { flex:1; min-width:0;
}

/* ВАЖНО: переносы, чтобы длинный текст/смайлы/URL не растягивали контейнер */
.gc-msg {
    word-break: break-word;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}