/* =========================================================
   КОНТЕЙНЕРЫ - СТАНДАРТИЗИРОВАННЫЕ СТИЛИ
   Левая боковая панель + Главный блок
   ========================================================= */

/* Основной контейнер */
.content_section.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
  box-sizing: border-box;
}

.content_section .row {
  margin: 0 -15px;
  box-sizing: border-box;
  /* Используем clearfix для float */
  overflow: hidden;
  width: 100%;
}

/* Очистка float - clearfix */
.content_section .row::before,
.content_section .row::after {
  content: "";
  display: table;
  clear: both;
}

/* Убеждаемся, что row не ломает layout */
.content_section.container .row {
  display: block !important;
  position: relative !important;
}

/* Левая боковая панель - МАКСИМАЛЬНЫЙ ПРИОРИТЕТ */
section.content_section.container .row aside.sidebar.span3.pull-left,
.content_section.container .row .sidebar.span3.pull-left,
.content_section .row aside.sidebar.span3.pull-left,
aside.sidebar.span3.pull-left {
  float: left !important;
  width: 25% !important;
  padding: 0 15px !important;
  box-sizing: border-box !important;
  clear: none !important;
  display: block !important;
  position: relative !important;
  margin: 0 !important;
}

/* Главный блок контента - МАКСИМАЛЬНЫЙ ПРИОРИТЕТ */
section.content_section.container .row div.content.span9.pull-right,
.content_section.container .row .content.span9.pull-right,
.content_section .row div.content.span9.pull-right,
div.content.span9.pull-right {
  float: right !important;
  width: 75% !important;
  padding: 0 15px !important;
  box-sizing: border-box !important;
  clear: none !important;
  display: block !important;
  position: relative !important;
  margin: 0 !important;
}

/* Переопределяем любые другие правила, которые могут ломать layout */
.content_section.container .row .sidebar,
.content_section.container .row .content {
  clear: none !important;
}

/* Обертка статьи */
.article {
  width: 100%;
  box-sizing: border-box;
}

/* Основной контент */
.full_text {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

/* =========================================================
   АДАПТИВНОСТЬ
   ========================================================= */

/* Планшеты */
@media (max-width: 992px) {
  .content_section.container .row {
    display: flex !important;
    flex-direction: column !important;
  }
  
  .sidebar.span3.pull-left {
    float: none !important;
    width: 100% !important;
    order: 2 !important; /* Sidebar идет после content */
    margin-bottom: 0 !important;
    margin-top: 30px !important;
  }
  
  .content.span9.pull-right {
    float: none !important;
    width: 100% !important;
    order: 1 !important; /* Content идет первым */
  }
}

/* Мобильные */
@media (max-width: 768px) {
  .content_section.container {
    padding: 0 10px;
  }
  
  .content_section .row {
    margin: 0 -10px;
    display: flex !important;
    flex-direction: column !important;
  }
  
  .sidebar.span3.pull-left {
    float: none !important;
    width: 100% !important;
    order: 2 !important; /* Sidebar идет ПОСЛЕ content в мобильной версии */
    margin-top: 30px !important;
    margin-bottom: 0 !important;
    padding: 0 10px;
  }
  
  .content.span9.pull-right {
    float: none !important;
    width: 100% !important;
    order: 1 !important; /* Content идет ПЕРВЫМ в мобильной версии */
    padding: 0 10px;
  }
}

/* =========================================================
   ТЕМНАЯ ТЕМА
   ========================================================= */

body.dark-mode .content_section.container,
html.dark-mode .content_section.container {
  background: transparent !important;
}

body.dark-mode .content_section .row,
html.dark-mode .content_section .row {
  background: transparent !important;
}

body.dark-mode .sidebar.span3.pull-left,
html.dark-mode .sidebar.span3.pull-left {
  background: transparent !important;
}

body.dark-mode .content.span9.pull-right,
html.dark-mode .content.span9.pull-right {
  background: transparent !important;
}

body.dark-mode .article,
html.dark-mode .article {
  background: transparent !important;
}

/* =========================================================
   КРИТИЧЕСКИЕ ПРАВИЛА ДЛЯ ПРАВИЛЬНОГО LAYOUT
   Должны быть в конце файла для максимального приоритета
   ========================================================= */

/* ПЕРЕОПРЕДЕЛЯЕМ ВСЕ ПРАВИЛА, КОТОРЫЕ МОГУТ ЛОМАТЬ LAYOUT */
section.content_section.container > div.row > aside.sidebar.span3.pull-left {
  float: left !important;
  width: 25% !important;
  clear: none !important;
  display: block !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 15px !important;
  box-sizing: border-box !important;
}

section.content_section.container > div.row > div.content.span9.pull-right {
  float: right !important;
  width: 75% !important;
  clear: none !important;
  display: block !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 15px !important;
  box-sizing: border-box !important;
}

/* Убираем clear: both у row, если он есть */
section.content_section.container > div.row::after {
  clear: both;
  content: "";
  display: table;
}

/* Убеждаемся, что row не имеет display: flex или других свойств, ломающих float */
section.content_section.container > div.row {
  display: block !important;
  overflow: hidden !important;
  width: 100% !important;
}

/* =========================================================
   МОБИЛЬНАЯ ВЕРСИЯ - ПЕРЕОПРЕДЕЛЕНИЕ С МАКСИМАЛЬНЫМ ПРИОРИТЕТОМ
   Sidebar должен быть ПОСЛЕ основного контента
   ========================================================= */

/* Планшеты - sidebar после контента */
@media (max-width: 992px) {
  section.content_section.container > div.row {
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
  }
  
  section.content_section.container > div.row > aside.sidebar.span3.pull-left {
    float: none !important;
    width: 100% !important;
    order: 2 !important; /* Sidebar идет ПОСЛЕ content */
    margin-top: 30px !important;
    margin-bottom: 0 !important;
    padding: 0 15px !important;
  }
  
  section.content_section.container > div.row > div.content.span9.pull-right {
    float: none !important;
    width: 100% !important;
    order: 1 !important; /* Content идет ПЕРВЫМ */
    padding: 0 15px !important;
  }
}

/* Мобильные - sidebar после контента */
@media (max-width: 768px) {
  section.content_section.container > div.row {
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
  }
  
  section.content_section.container > div.row > aside.sidebar.span3.pull-left {
    float: none !important;
    width: 100% !important;
    order: 2 !important; /* Sidebar идет ПОСЛЕ content в мобильной версии */
    margin-top: 30px !important;
    margin-bottom: 0 !important;
    padding: 0 10px !important;
  }
  
  section.content_section.container > div.row > div.content.span9.pull-right {
    float: none !important;
    width: 100% !important;
    order: 1 !important; /* Content идет ПЕРВЫМ в мобильной версии */
    padding: 0 10px !important;
  }
}
