/* =========================================
   TALKOV STAGE 10
   Layout / shell / feed / sidebars / mobile
   Палитры темы НЕ дублируем.
   Они живут в repost-stage10-theme-3modes-v2.css
========================================= */

:root {
  --talkov-shell-desktop: 1420px;
  --talkov-shell-tablet: 1180px;
  --talkov-shell-mobile: 100%;

  --talkov-gap-xl: 32px;
  --talkov-gap-lg: 24px;
  --talkov-gap-md: 18px;
  --talkov-gap-sm: 14px;

  --talkov-side-left: 250px;
  --talkov-side-right: 340px;
}

/* -----------------------------------------
   Base
----------------------------------------- */

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;
  box-sizing: border-box;
}

.container {
  max-width: var(--talkov-shell-desktop);
}

/* -----------------------------------------
   Main grids
----------------------------------------- */

.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 > .talkov-leftmenu {
  width: 100%;
  min-width: 0;
  align-self: start;
}

/* Правая колонка */
.main__container > .sidebar,
.global__container > .sidebar,
.cat__container > .sidebar {
  width: 100%;
  min-width: 0;
  max-width: var(--talkov-side-right);
  justify-self: stretch;
  align-self: start;
}

/* Sticky */
.aside__sticky,
.sidebar__sticky {
  top: 92px;
}

/* -----------------------------------------
   Content wrappers
----------------------------------------- */

.layout,
.talkov-layout,
.content,
.talkov-feed,
.community__feed,
.story,
.story__content,
.full-story,
.short-story,
.post,
.post-card,
.entry-content,
.full__main,
.short__main,
.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,
.addpost,
.addpost__content,
.addpost__aside,
.profile-header,
.user-box,
.user-aside,
.user-setting {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.content > *:first-child,
.talkov-feed > *:first-child {
  margin-top: 0;
}

.content > * + *,
.talkov-feed > * + * {
  margin-top: var(--talkov-gap-lg);
}

/* -----------------------------------------
   Media safety
----------------------------------------- */

img,
video,
iframe,
embed,
object,
svg,
canvas {
  max-width: 100%;
}

.story img,
.entry-content img,
.post__body img,
.full__main img,
.short__main img,
.addpost img,
.user-setting img {
  display: block;
  max-width: 100%;
  height: auto;
}

.story iframe,
.entry-content iframe,
.post__body iframe,
.full__main iframe,
.short__main iframe {
  width: 100%;
  max-width: 100%;
}

/* Таблицы */
table {
  width: 100%;
  max-width: 100%;
  display: block;
  overflow-x: auto;
}

/* -----------------------------------------
   Main page showcase blocks
----------------------------------------- */

.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;
}

/* -----------------------------------------
   Feed / posts / story
----------------------------------------- */

.post,
.post-card,
.short-story,
.full-story,
.story,
.story__content,
.entry-content,
.full__main,
.short__main {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.post__body,
.story__body,
.entry-content,
.full__main,
.short__main {
  overflow-wrap: break-word;
  word-break: break-word;
}

/* -----------------------------------------
   Sidebar blocks
----------------------------------------- */

.sidebar,
.sidebar__inner,
.sidebar__block,
.side-card {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* -----------------------------------------
   Left menu
----------------------------------------- */

.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;
}

/* -----------------------------------------
   Forms / settings
----------------------------------------- */

.profile-settings-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--talkov-gap-sm);
}

.addpost,
.addpost__content,
.addpost__aside {
  min-width: 0;
}

/* -----------------------------------------
   Main spacing
----------------------------------------- */

main.container {
  padding-top: 18px;
  padding-bottom: 28px;
}

/* -----------------------------------------
   Desktop medium
----------------------------------------- */

@media (max-width: 1440px) {
  .container {
    max-width: 1320px;
  }

  .main__container {
    grid-template-columns: 220px minmax(0, 1fr) 310px;
  }

  .global__container,
  .cat__container {
    grid-template-columns: minmax(0, 1fr) 310px;
  }

  .main__container > .sidebar,
  .global__container > .sidebar,
  .cat__container > .sidebar {
    max-width: 310px;
  }
}

@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;
  }

  .global__container,
  .cat__container {
    grid-template-columns: 1fr 300px;
  }

  .main__container > .cat,
  .main__container > .talkov-leftmenu {
    display: none;
  }

  .main__container > .sidebar,
  .global__container > .sidebar,
  .cat__container > .sidebar {
    max-width: 300px;
  }

  .profile-settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* -----------------------------------------
   Tablet / mobile layout
----------------------------------------- */

@media (max-width: 991.98px) {
  .container {
    max-width: 100%;
    padding-left: 14px;
    padding-right: 14px;
  }

  .main__container,
  .global__container,
  .cat__container,
  .layout,
  .talkov-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: var(--talkov-gap-md) !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;
  }

  .content,
  .talkov-feed {
    order: 1;
  }

  .main__container > .cat,
  .main__container > .talkov-leftmenu {
    display: none !important;
  }

  .aside__sticky,
  .sidebar__sticky {
    position: static !important;
    top: auto !important;
  }

  .profile-settings-grid {
    grid-template-columns: 1fr;
  }
}

/* -----------------------------------------
   Mobile
----------------------------------------- */

@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 > * + * {
    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-story/post на мобилке */
  .full__main,
  .short__main,
  .story,
  .story__content,
  .post__body,
  .entry-content,
  .post,
  .post-card,
  .content,
  .talkov-feed,
  .full-story,
  .short-story {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .entry-content iframe,
  .story iframe,
  .post__body iframe {
    width: 100% !important;
    max-width: 100% !important;
  }

  .sidebar {
    width: 100%;
    max-width: 100%;
  }

  /* Нижний мобильный подвал не трогаем */
  .panel,
  .panel__inner {
    max-width: 100%;
  }
}

@media (max-width: 575.98px) {
  .container {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .content > * + *,
  .talkov-feed > * + * {
    margin-top: 14px;
  }

  .card,
  .post-card,
  .short-story,
  .full-story,
  .box,
  .category-box {
    border-radius: 16px;
  }
}

/* -----------------------------------------
   Legacy template neutralizers
----------------------------------------- */

.content,
.sidebar,
.cat,
.talkov-feed,
.community__feed,
.short-story,
.full-story,
.post-card,
.story,
.story__content,
.entry-content {
  float: none;
}

.content,
.talkov-feed,
.story,
.short-story,
.full-story,
.post,
.post-card {
  left: auto;
  right: auto;
}

.row > .content,
.row > .sidebar,
.row > .cat {
  min-width: 0;
}