/*
  Обсуждение /talk — только то, чего нет в app.css. Владелец — T.
  Плакатный стиль: рамки, тени, шрифты и цвета — из токенов app.css.
*/

.talk-page { padding-top: clamp(1.5rem, 1rem + 3vw, 3.5rem); }
.talk-h1 { margin-bottom: clamp(1rem, 0.6rem + 2vw, 2.25rem); }
.talk-noscript { margin-bottom: var(--s-5); }

/* ---------- форма записи ---------- */

.talk-compose { display: grid; gap: var(--s-3); }

.talk-compose__text {
  min-height: 8.5rem;
  padding: 0.875rem 1rem;
  font-size: 1.125rem;
  line-height: 1.5;
  box-shadow: var(--shadow);
}
.talk-compose__text:hover,
.talk-compose__text:focus-visible { box-shadow: var(--shadow); }

.talk-compose__under {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--s-2) var(--s-4);
  margin-top: var(--s-1);
}
.talk-rules { font-size: var(--fs-xs); font-weight: 600; color: var(--c-muted); line-height: 1.4; }

/* Остаток символов: акцидентные цифры; у предела — тёмно-красный (AA). */
.talk-count {
  flex: none;
  font-family: var(--font-display);
  font-size: 1.375rem;
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--c-muted);
}
.talk-count.is-near { color: var(--c-danger); }
.talk-count.is-over { color: var(--c-danger); text-decoration: underline; text-decoration-thickness: 3px; }

/* «Add details» слева, «Post» справа; на телефоне — друг под другом. */
.talk-compose__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--s-3) var(--s-5);
}
.talk-details { flex: 1 1 18rem; min-width: 0; }
.talk-details > summary { min-height: 3.25rem; }
.talk-details__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
  gap: var(--s-3) var(--s-4);
  margin-top: var(--s-3);
}
.talk-details .field__label { font-size: 1.1875rem; }
.talk-compose__post { flex: none; min-width: 9rem; }
@media (max-width: 29.99rem) {
  .talk-compose__post { width: 100%; }
}

/* Turnstile: виден, только когда просит человека нажать. */
.talk-captcha { max-width: 100%; }
.talk-captcha:empty { display: none; }

/* Короткие сообщения у формы: ошибка — розовая плашка, «отправлено» — жёлтая. */
.talk-msg {
  padding: 0.625rem 0.875rem;
  border: var(--bw) solid var(--c-ink);
  font-size: var(--fs-sm);
  font-weight: 700;
  line-height: 1.4;
}
.talk-msg:empty { display: none; }
.talk-msg--error { border-color: var(--c-danger); background: var(--c-accent-weak); color: var(--c-danger); }
.talk-msg--ok { background: var(--c-pop); color: var(--c-ink); }
.talk-msg--sm { margin-top: var(--s-3); padding: 0.375rem 0.625rem; font-size: var(--fs-xs); }

/* ---------- фильтры ---------- */

.talk-feed-section { margin-top: clamp(3rem, 2rem + 4vw, 5rem); }

.talk-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3);
  padding-bottom: var(--s-4);
  border-bottom: var(--bw) solid var(--c-ink);
}
.talk-filters__country { min-width: 0; max-width: 100%; }
.talk-filters__country .select { max-width: 100%; }

/* Переключатель «My language / All languages»: две кнопки в одной рамке, выбранная — жёлтая. */
.talk-seg { display: inline-flex; max-width: 100%; border: var(--bw) solid var(--c-ink); }
.talk-seg__btn {
  min-height: 2.75rem;
  padding: 0.375rem 0.875rem;
  border: 0;
  background: var(--c-surface);
  color: var(--c-ink);
  font-family: var(--font-display);
  font-size: 1.1875rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  transition: background-color var(--t-fast) ease;
}
.talk-seg__btn + .talk-seg__btn { border-inline-start: var(--bw) solid var(--c-ink); }
.talk-seg__btn:hover { background: var(--c-surface-2); }
.talk-seg__btn[aria-pressed="true"] { background: var(--c-pop); }
.talk-seg__btn:focus-visible { outline-offset: 2px; position: relative; z-index: 1; }

.talk-fallback { margin-top: var(--s-3); font-size: var(--fs-sm); font-weight: 600; color: var(--c-muted); }

/* ---------- лента ---------- */

.talk-feed { display: grid; gap: var(--s-5); margin-top: var(--s-5); }
.talk-feed.is-loading { opacity: 0.55; transition: opacity var(--t-fast) ease; }
.talk-skel { display: grid; gap: var(--s-1); }
.talk-empty__text {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 1.3rem + 2vw, 2.75rem);
  font-weight: 900;
  line-height: var(--lh-tight);
  text-transform: uppercase;
}
.talk-feed__error { display: grid; gap: var(--s-3); justify-items: start; }

.talk-post { scroll-margin-top: var(--s-6); }
.talk-post.is-new,
.talk-reply.is-new { outline: 3px solid var(--c-accent); outline-offset: 3px; }

.talk-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); margin-bottom: var(--s-3); }
.talk-who {
  min-width: 0;
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}
.talk-who.is-anon { color: var(--c-muted); }
.talk-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); min-width: 0; }

/* Наклейки страны и специализации: мельче, тень маленькая, длинные подписи переносятся. */
.talk-tag {
  max-width: 100%;
  padding: 0.25rem 0.5rem 0.2rem;
  font-size: 1rem;
  box-shadow: 2px 2px 0 var(--c-ink);
  white-space: normal;
  overflow-wrap: anywhere;
  transform: rotate(-2deg);
}
.talk-tag + .talk-tag { transform: rotate(1.5deg); }

.talk-time { font-size: var(--fs-xs); font-weight: 600; color: var(--c-muted); white-space: nowrap; }
.talk-lang {
  padding: 0.05rem 0.35rem;
  border: 2px solid var(--c-ink);
  font-size: var(--fs-xs);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.04em;
}
.talk-pending {
  padding: 0.2rem 0.5rem;
  background: var(--c-ink);
  color: var(--c-surface);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

/* Текст записи: переводы строк как есть, длинные слова и «ссылки» переносятся. */
.talk-text {
  font-size: 1.0625rem;
  line-height: 1.55;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.talk-text.is-clamped { max-height: calc(8 * 1.55em); overflow: hidden; }
.talk-more { margin-top: var(--s-2); }

.talk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); margin-top: var(--s-4); }
.talk-actions__end { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); margin-inline-start: auto; }
.talk-act { font-size: 1.125rem; }
.talk-act--same[aria-pressed="true"] { background: var(--c-pop); }
.talk-act[aria-expanded="true"] { background: var(--c-pop); }
/* .btn--sm возвращает тень поверх .btn--ghost — тихим кнопкам она не нужна. */
.talk-act--quiet,
.talk-act--quiet:hover,
.talk-act--quiet:active { box-shadow: none; transform: none; }
.talk-act--quiet { padding-inline: 0.625rem; color: var(--c-muted); }
.talk-act--quiet:hover { color: var(--c-ink); }
.talk-done {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--c-muted);
}
.talk-done:focus-visible { outline-offset: 2px; }
.talk-confirm { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); }
.talk-confirm__q { font-size: var(--fs-sm); font-weight: 700; }

/* ---------- ветка ---------- */

.talk-thread {
  display: grid;
  gap: var(--s-4);
  margin-top: var(--s-4);
  padding-inline-start: clamp(0.75rem, 0.4rem + 1.5vw, 1.5rem);
  border-inline-start: var(--bw) solid var(--c-ink);
}
.talk-thread__statusrow { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2) var(--s-3); }
.talk-thread__status { font-size: var(--fs-sm); font-weight: 600; color: var(--c-muted); }
.talk-replies { display: grid; gap: var(--s-4); }
.talk-reply { padding-bottom: var(--s-4); border-bottom: 1px solid var(--c-line-soft); }
.talk-reply .talk-who { font-size: 1.25rem; }
.talk-reply .talk-head { margin-bottom: var(--s-2); }
.talk-reply .talk-actions { margin-top: var(--s-3); }

.talk-replyform { display: grid; gap: var(--s-2); }
.talk-replyform__text { min-height: 4.5rem; }
.talk-replyform__bar { display: flex; align-items: center; justify-content: flex-end; gap: var(--s-3); }
.talk-count--reply { margin-inline-end: auto; font-size: 1.125rem; }

.talk-loadmore { display: grid; justify-items: center; gap: var(--s-3); margin-top: var(--s-6); }

@media (max-width: 29.99rem) {
  .talk-actions__end { margin-inline-start: 0; }
  .talk-act--quiet { padding-inline: 0.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .talk-tag, .talk-tag + .talk-tag { transform: none; }
}