/* Talkov Stage 10
   Layout / shell / feed / sidebars / mobile balance
   Палитры темы НЕ дублируем — они живут в repost-stage10-theme-3modes-v2.css
*/

/* ------------------------------
   App shell / width
------------------------------ */

:root {
  --talkov-shell-desktop: 1420px;
  --talkov-shell-tablet: 1100px;
  --talkov-shell-mobile: 100%;
  --talkov-gap-xl: 28px;
  --talkov-gap-lg: 24px;
  --talkov-gap-md: 18px;
  --talkov-gap-sm: 14px;
  --talkov-side-left: 250px;
  --talkov-side-right: 330px;
}

html,
body {
  overflow-x: hidden;
}

body {
  min-width: 320px;
}

/* Главная оболочка */
.container,
.main__container,
.global__container,
.cat__container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  min-width: 0;
}

/* Верхний контейнер */
.container {
  max-width: var(--talkov-shell-desktop);
}

/* ------------------------------
   Главная сетка
------------------------------ */

.main__container {
  display: grid;
  grid-template-columns: var(--talkov-side-left) minmax(0, 1fr) var(--talkov-side-right);
  gap: var(--talkov-gap-lg);
  align-items: start;
}

.global__container,
.cat__container {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--talkov-side-right);
  gap: var(--talkov-gap-lg);
  align-items: start;
}

/* Убираем прилипание контента к левому краю */
.main__container > .content,
.global__container > .content,
.cat__container > .content,
.main__container > .talkov-feed,
.global__container > .talkov-feed,
.cat__container > .talkov-feed {
  width: 100%;
  min-width: 0;
  max-width: none;
  justify-self: stretch;
  align-self: start;
}

/* Боковые колонки */
.main__container > .cat,
.main__container > .aside,
.main__container > .sidebar,
.global__container > .sidebar,
.cat__container > .sidebar {
  width: 100%;
  min-width: 0;
  align-self: start;
}

.main__container > .sidebar,
.global__container > .sidebar,
.cat__container > .sidebar {
  max-width: var(--talkov-side-right);
  justify-self: stretch;
}

/* Чтобы липкие блоки не ломали поток */
.aside__sticky,
.sidebar__sticky {
  top: 92px;
}

/* ------------------------------
   Контентные блоки
------------------------------ */

.layout,
.talkov-layout,
.content,
.talkov-feed,
.community__feed {
  min-width: 0;
}

.content > *:first-child,
.talkov-feed > *:first-child {
  margin-top: 0;
}

.content > * + *,
.talkov-feed > * + * {
  margin-top: var(--talkov-gap-lg);
}

/* Посты и карточки */
.post,
.post-card,
.short-story,
.full-story,
.box,
.card,
.category-box,
.video-spot,
.cover,
.memory-card,
.forum-icon,
.forum-mini,
.small-card,
.route-item,
.menu-card,
.side-card,
.notify-preview,
.timeline,
.live-comments,
.video-mini,
.notify-box,
.settings-box,
.desktop-popover,
.profile-setting-card {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Крупные блоки на full/story */
.full__main,
.short__main,
.story,
.story__content,
.post__body,
.entry-content {
  min-width: 0;
  max-width: 100%;
}

/* Медиа не должны раздувать ширину */
img,
video,
iframe,
table,
embed,
object {
  max-width: 100%;
}

.story img,
.entry-content img,
.post__body img,
.full__main img,
.short__main img {
  height: auto;
  display: block;
}

/* Видео-блоки */
.video-spotlight,
.video-player,
.player,
.video-box {
  width: 100%;
  min-width: 0;
}

/* ------------------------------
   Левая колонка
------------------------------ */

.talkov-leftmenu,
.cat.aside__sticky {
  width: 100%;
  min-width: 0;
}

.talkov-leftmenu .cat__inner,
.cat.aside__sticky .cat__inner {
  width: 100%;
  box-sizing: border-box;
}

/* ------------------------------
   Правая колонка
------------------------------ */

.sidebar,
.sidebar__inner,
.sidebar__block,
.side-card {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Чтобы правый столбец не уезжал */
.sidebar {
  justify-self: stretch;
  align-self: start;
}

/* ------------------------------
   Главная витрина
------------------------------ */

[available=main] .main__container > .content,
.home .main__container > .content {
  align-self: start;
}

.final-unity-banner,
.memory-route-strip,
.hero,
.publish-bar,
.featured-links,
.memory-sections,
.category-covers,
.video-spotlight,
.video-slider,
.vk-video-block,
.comments-timeline {
  width: 100%;
  min-width: 0;
}

/* ------------------------------
   Формы публикации / профили
------------------------------ */

.addpost,
.addpost__content,
.addpost__aside,
.profile-header,
.profile-settings-grid,
.profile-setting-card,
.user-box,
.user-aside,
.user-setting {
  min-width: 0;
  max-width: 100%;
}

/* Настройки профиля */
.profile-settings-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--talkov-gap-sm);
}

/* ------------------------------
   Хедер-отступы под контент
------------------------------ */

main.container {
  padding-top: 18px;
  padding-bottom: 28px;
}

/* ------------------------------
   Планшеты
------------------------------ */

@media (max-width: 1360px) {
  .container {
    max-width: 1240px;
  }

  .main__container {
    grid-template-columns: 220px minmax(0, 1fr) 300px;
  }

  .global__container,
  .cat__container {
    grid-template-columns: minmax(0, 1fr) 300px;
  }

  .main__container > .sidebar,
  .global__container > .sidebar,
  .cat__container > .sidebar {
    max-width: 300px;
  }
}

@media (max-width: 1199.98px) {
  .container {
    max-width: var(--talkov-shell-tablet);
    padding-left: 16px;
    padding-right: 16px;
  }

  .main__container {
    grid-template-columns: 1fr 300px;
  }

  .main__container > .cat.aside__sticky,
  .main__container > .talkov-leftmenu {
    display: none;
  }

  .global__container,
  .cat__container {
    grid-template-columns: 1fr 300px;
  }

  .profile-settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ------------------------------
   Мобилки
------------------------------ */

@media (max-width: 991.98px) {
  .container {
    max-width: 100%;
    padding-left: 14px;
    padding-right: 14px;
  }

  .main__container,
  .global__container,
  .cat__container {
    grid-template-columns: 1fr;
    gap: var(--talkov-gap-md);
  }

  .main__container > .sidebar,
  .global__container > .sidebar,
  .cat__container > .sidebar {
    max-width: none;
  }

  .sidebar {
    order: 2;
  }

  .content,
  .talkov-feed {
    order: 1;
  }

  .aside__sticky,
  .sidebar__sticky {
    position: static !important;
    top: auto !important;
  }

  .profile-settings-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767.98px) {
  .container {
    padding-left: 10px;
    padding-right: 10px;
  }

  main.container {
    padding-top: 10px;
    padding-bottom: 18px;
  }

  .content > * + *,
  .talkov-feed > * + * {
    margin-top: var(--talkov-gap-md);
  }

  .card,
  .post-card,
  .short-story,
  .full-story,
  .box,
  .category-box,
  .side-card,
  .menu-card,
  .notify-item,
  .profile-setting-card {
    border-radius: 18px;
  }

  /* Главная проблема на скрине: контент сжимается.
     Жёстко отпускаем ширину. */
  .full__main,
  .short__main,
  .story,
  .story__content,
  .post__body,
  .entry-content,
  .post,
  .post-card,
  .content,
  .talkov-feed {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .entry-content iframe,
  .story iframe,
  .post__body iframe {
    width: 100%;
    max-width: 100%;
  }

  /* Правый столбец на мобилке вниз */
  .sidebar {
    width: 100%;
    max-width: 100%;
  }

  /* Не трогаем нижний мобильный подвал */
  .panel,
  .panel__inner {
    max-width: 100%;
  }
}

@media (max-width: 575.98px) {
  .container {
    padding-left: 8px;
    padding-right: 8px;
  }

  .content > * + *,
  .talkov-feed > * + * {
    margin-top: 14px;
  }

  .card,
  .post-card,
  .short-story,
  .full-story,
  .box,
  .category-box {
    border-radius: 16px;
  }
}

/* ------------------------------
   Спецфикс: если DLE/шаблон
   даёт старые float / fixed widths
------------------------------ */

.content,
.sidebar,
.cat,
.talkov-feed,
.community__feed,
.short-story,
.full-story,
.post-card,
.story,
.story__content,
.entry-content {
  float: none;
}

/* Если где-то старый шаблон жёстко ставит margin-left */
.content,
.talkov-feed,
.story,
.short-story,
.full-story {
  left: auto;
  right: auto;
}

/* Старые row/col контейнеры */
.row > .content,
.row > .sidebar,
.row > .cat {
  min-width: 0;
}
/* MOBILE WIDTH FIX — add at the very end */

@media (max-width: 991.98px) {
  .main__container,
  .global__container,
  .cat__container,
  .layout,
  .talkov-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .main__container > .content,
  .global__container > .content,
  .cat__container > .content,
  .main__container > .talkov-feed,
  .global__container > .talkov-feed,
  .cat__container > .talkov-feed,
  .content,
  .talkov-feed,
  .story,
  .story__content,
  .full-story,
  .short-story,
  .post-card,
  .post,
  .entry-content,
  .full__main,
  .short__main {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-self: stretch !important;
  }

  .main__container > .sidebar,
  .global__container > .sidebar,
  .cat__container > .sidebar,
  .sidebar {
    width: 100% !important;
    max-width: 100% !important;
    order: 2 !important;
  }

  .main__container > .cat,
  .main__container > .talkov-leftmenu {
    display: none !important;
  }

  .aside__sticky,
  .sidebar__sticky {
    position: static !important;
    top: auto !important;
  }

  .story img,
  .entry-content img,
  .post__body img,
  .full__main img,
  .short__main img,
  iframe,
  video {
    max-width: 100% !important;
    height: auto !important;
  }
}

@media (max-width: 767.98px) {
  .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  main.container {
    padding-top: 10px !important;
    padding-bottom: 18px !important;
  }

  .content,
  .talkov-feed,
  .story,
  .story__content,
  .full-story,
  .short-story,
  .post-card,
  .post {
    width: 100% !important;
    max-width: 100% !important;
  }
}
.talkov-cover-setting {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

.talkov-cover-setting__preview {
  width: 100%;
  min-height: 180px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(0,0,0,.03);
}

.talkov-cover-setting__image {
  width: 100%;
  height: 180px;
  object-fit: cover;
  display: block;
}

.talkov-cover-setting__meta h4 {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 600;
}

.talkov-cover-setting__meta p {
  margin: 0 0 10px;
  font-size: 13px;
  color: rgba(var(--color-black), .55);
}

.talkov-cover-setting__hint {
  margin-top: 8px;
  font-size: 12px;
  color: rgba(var(--color-black), .45);
}

.talkov-cover-setting__upload input[type="file"] {
  width: 100%;
}

@media (max-width: 767.98px) {
  .talkov-cover-setting__preview,
  .talkov-cover-setting__image {
    min-height: 140px;
    height: 140px;
  }
}

/* -----------------------------------------
   Profile cover / userinfo
----------------------------------------- */
.talkov-profile-cover {
  position: relative;
  min-height: 320px;
  border-radius: 26px;
  overflow: hidden;
  background-color: #101923;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(255,255,255,.08);
}

.talkov-profile-cover__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(6,12,20,.18) 0%, rgba(6,12,20,.46) 45%, rgba(6,12,20,.78) 100%);
}

.talkov-profile-cover__inner {
  position: relative;
  z-index: 2;
  padding: 24px;
  min-height: 320px;
  display: flex;
  align-items: flex-end;
}

.talkov-profile-cover__avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 50%;
}

.talkov-cover-setting__input input[type="text"],
.talkov-cover-setting__input .textin {
  width: 100%;
}

@media (max-width: 767.98px) {
  .talkov-profile-cover {
    min-height: 240px;
    border-radius: 20px;
  }

  .talkov-profile-cover__inner {
    min-height: 240px;
    padding: 16px;
  }
}

/* =========================================================
   GUEST / ONLINE LABEL FIX
   - hide profile social actions for guests through tpl
   - remove accidental duplicated action bars
   - make hidden-online label friendly
========================================================= */

.vk-profile-head__status.is-hidden {
  color: var(--muted, rgba(255,255,255,.68));
  font-weight: 600;
}

.vk-profile-head__actions .talkov-social-actions ~ .talkov-social-actions,
.talkov-social-actions + .talkov-social-actions {
  display: none !important;
}

.talkov-social-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}

.talkov-social-btn {
  min-height: 42px;
  border-radius: 14px;
  font-weight: 700;
  white-space: nowrap;
}

.talkov-social-actions .is-active {
  background: var(--accent, #d1a34a) !important;
  border-color: var(--accent, #d1a34a) !important;
  color: #111722 !important;
}

.talkov-social-actions .is-loading {
  opacity: .65;
  pointer-events: none;
}

.talkov-social-more {
  position: relative;
}

.talkov-social-more__menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 190px;
  padding: 8px;
  border-radius: 16px;
  border: 1px solid var(--line, rgba(255,255,255,.12));
  background: var(--surface, #101923);
  box-shadow: var(--shadow, 0 20px 50px rgba(0,0,0,.35));
  display: none;
  z-index: 40;
}

.talkov-social-more:hover .talkov-social-more__menu,
.talkov-social-more:focus-within .talkov-social-more__menu {
  display: grid;
  gap: 6px;
}

.vk-profile-head__avatar {
  overflow: visible !important;
}

.vk-profile-head__avatar img {
  border-radius: 50%;
  overflow: hidden;
}

.vk-profile-head__online-dot {
  z-index: 5;
}

html[data-theme="light"] .vk-profile-head__status.is-hidden {
  color: rgba(17,24,39,.62);
}

html[data-theme="light"] .talkov-social-more__menu {
  background: #fff;
  border-color: rgba(0,0,0,.08);
}

@media (max-width: 991.98px) {
  .vk-profile-head__actions,
  .talkov-social-actions {
    justify-content: flex-start;
    width: 100%;
  }
}

@media (max-width: 767.98px) {
  .talkov-social-actions {
    gap: 8px;
  }

  .talkov-social-btn {
    min-height: 40px;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 13px;
  }
}