/* ============================================================================
 * ПАНЕЛЬ ЧАТА ВОЛНЫ 6: вкладки (CT0) и опросы (PL2) — отдельным файлом после
 * app.css (его хвост одновременно дописывают другие потоки).
 * Значения — Jitsi (chat/components/web/ChatHeader, polls/components/web/*).
 * ========================================================================== */

/* ---- CT0: тело чата одним узлом, полоса вкладок, панели вкладок ---- */
.j-chat-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; position: relative; }
.j-chat-body[hidden], .j-chat-tabpanel[hidden], .j-chat-tabs[hidden] { display: none; }
.j-chat-tabs { display: flex; flex: none; box-shadow: inset 0 -2px 0 #3D3D3D; }
.j-chat-tab {
  flex: 1 1 0; height: 52px; padding: 14px; border: 0; background: transparent; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  color: #C2C2C2; font: inherit; font-size: 14px; line-height: 20px; font-weight: 600;
  box-shadow: inset 0 -2px 0 transparent;
}
.j-chat-tab .icon { width: 20px; height: 20px; }
.j-chat-tab:hover { color: #fff; }
.j-chat-tab--on { color: #fff; box-shadow: inset 0 -2px 0 #4687ED; }
.j-chat-tab:focus-visible { outline: 0; box-shadow: inset 0 0 0 2px #4687ED; }
.j-chat-tab-badge {
  min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; box-sizing: border-box;
  background: #4687ED; color: #fff; font-size: 11px; line-height: 16px; text-align: center;
}
.j-chat-tabpanel { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }

/* ---- PL2: опросы ---- */
.j-polls { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.j-polls-list, .j-poll-form-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 16px; }
.j-polls-empty { margin: auto; display: flex; flex-direction: column; align-items: center; gap: 16px; color: #C2C2C2; text-align: center; font-size: 14px; line-height: 20px; }
.j-polls-empty .icon { width: 64px; height: 64px; color: #525252; }
.j-poll-card { background: #292929; border-radius: 8px; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.j-poll-card--closed { opacity: .75; }
.j-poll-q { font-size: 16px; line-height: 24px; font-weight: 600; color: #fff; overflow-wrap: anywhere; }
.j-poll-by { font-size: 12px; line-height: 16px; color: #C2C2C2; margin-bottom: 8px; }
.j-poll-answer { display: flex; align-items: flex-start; gap: 12px; padding: 6px 0; font-size: 14px; line-height: 20px; cursor: pointer; overflow-wrap: anywhere; }
.j-poll-check { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: #4687ED; }
.j-poll-actions, .j-poll-footer { display: flex; gap: 8px; }
.j-poll-actions { margin-top: 8px; }
.j-poll-actions > *, .j-poll-footer > * { flex: 1 1 0; }
.j-poll-footer { flex: none; padding: 16px; }
.j-poll-btn {
  height: 40px; padding: 0 16px; border: 0; border-radius: 6px; cursor: pointer;
  font: inherit; font-size: 14px; line-height: 20px; font-weight: 600;
}
.j-poll-btn--primary { background: #4687ED; color: #fff; }
.j-poll-btn--primary:hover { background: #246FE5; }
.j-poll-btn--secondary { background: #E0E0E0; color: #040404; }
.j-poll-btn--secondary:hover { background: #fff; }
.j-poll-btn:disabled { background: #3D3D3D; color: #858585; cursor: default; }
.j-poll-add { align-self: flex-start; flex: none; }
.j-poll-result { display: flex; flex-direction: column; gap: 4px; padding: 4px 0; }
.j-poll-result-row { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; line-height: 20px; }
.j-poll-result-name { overflow-wrap: anywhere; }
.j-poll-result--mine .j-poll-result-name { font-weight: 600; }
.j-poll-result-n { flex: none; color: #C2C2C2; font-variant-numeric: tabular-nums; }
.j-poll-bar { height: 4px; border-radius: 2px; background: #3D3D3D; overflow: hidden; }
.j-poll-bar i { display: block; height: 100%; background: #4687ED; }
.j-poll-voters { display: flex; flex-direction: column; gap: 2px; padding: 4px 0 4px 12px; font-size: 12px; line-height: 16px; color: #C2C2C2; }
.j-poll-links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 8px; }
.j-poll-link { padding: 0; border: 0; background: transparent; cursor: pointer; color: #6EA2FF; font: inherit; font-size: 12px; line-height: 16px; font-weight: 600; }
.j-poll-link:hover { text-decoration: underline; }
.j-poll-form { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.j-poll-form-scroll { gap: 8px; }
.j-poll-label { font-size: 14px; line-height: 20px; font-weight: 600; color: #fff; }
.j-poll-input {
  width: 100%; box-sizing: border-box; min-height: 40px; padding: 10px 16px; border: 0; border-radius: 6px;
  background: #3D3D3D; color: #fff; font: inherit; font-size: 14px; line-height: 20px; resize: none;
}
.j-poll-input::placeholder { color: #A3A3A3; }
.j-poll-input:focus { outline: 0; box-shadow: 0 0 0 2px #4687ED; }
.j-poll-options { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.j-poll-option { display: flex; flex-direction: column; gap: 4px; }
.j-poll-remove { align-self: flex-start; padding: 0; border: 0; background: transparent; cursor: pointer; color: #6EA2FF; font: inherit; font-size: 12px; line-height: 16px; }
.j-poll-error { color: #E04757; font-size: 12px; line-height: 16px; }
.j-poll-error[hidden] { display: none; }
.j-poll-draft-list { margin: 0; padding-left: 20px; font-size: 14px; line-height: 20px; color: #C2C2C2; }

/* ---- EM2: окно «Embed this meeting» ---- */
.j-embed { width: 400px; max-width: calc(100vw - 32px); }
.j-embed-code {
  width: 100%; box-sizing: border-box; padding: 10px 16px; border: 0; border-radius: 6px; resize: none;
  background: #3D3D3D; color: #fff; font-family: ui-monospace, Consolas, monospace; font-size: 12px; line-height: 16px;
}
.j-embed-code:focus { outline: 0; box-shadow: 0 0 0 2px #4687ED; }
.j-embed-actions { display: flex; justify-content: flex-end; }
.j-embed-copy {
  height: 40px; padding: 0 16px; border: 0; border-radius: 6px; cursor: pointer;
  background: #4687ED; color: #fff; font: inherit; font-size: 14px; font-weight: 600;
}
.j-embed-copy:hover { background: #246FE5; }
