/* ============================================================
   adaptive.css — адаптивный слой для страниц NewsMe (index / news / fuel ...).
   Подключать ПОСЛЕ родного style.css страницы (чтобы переопределять).
   Стратегия: десктоп (≥981px) = оригинал 1:1 (никаких правил),
   адаптив только в медиазапросах ниже.
   ============================================================ */

/* ===== ОБЩЕЕ для планшета и телефона (≤980px) ===== */
@media (max-width: 980px) {
  *, *::before, *::after { box-sizing: border-box; }
  html, body { max-width: 100%; }
  body { margin: 0 !important; padding: 6px !important; border: 0 !important; overflow-x: hidden; }
  img, video, iframe, embed, object { max-width: 100% !important; height: auto !important; }

  /* контейнеры — резиновые на всю ширину окна */
  .pw, .iefixb, .pw2, .pw3 { width: auto !important; max-width: 100% !important; margin: 0 auto !important; padding-left: 8px; padding-right: 8px; }
  .toplit { width: auto !important; max-width: 100% !important; position: static !important; height: auto !important; }

  /* меню категорий — перенос пунктов */
  .menu { float: none !important; width: 100% !important; height: auto !important; background: none !important; padding-left: 0 !important; }
  .menu_in { float: none !important; width: 100% !important; display: flex; flex-wrap: wrap; gap: 1px; background: none !important; padding-right: 0 !important; }
  .menu a, .menu a:visited { float: none !important; }

  /* широкие виджет-обёртки — в ширину своей колонки */
  .iefix, .iefix2, .iefix21, .iefix22, .iefix3, .scell570, .bcolAll { width: 100% !important; max-width: 100% !important; }
  .imgborderr, .iwidth, .iwidthb, .search_input { max-width: 100%; }
  .search_input { width: auto !important; max-width: 50vw; }
  table { max-width: 100% !important; }

  /* форма комментариев (страница статьи): textarea фикс. ширины → резиновая */
  textarea { max-width: 100% !important; width: 100% !important; box-sizing: border-box !important; }
}

/* ===== ПЛАНШЕТ (701–980px): сохраняем ДВЕ колонки ===== */
@media (min-width: 701px) and (max-width: 980px) {
  /* правый сайдбар — РОДНАЯ фикс. ширина 320px: виджеты рендерятся как в оригинале */
  .bcolRight { width: 320px !important; }
  /* главная колонка занимает остаток */
  .bcolLeft, .bcolLeft2 { width: calc(100% - 340px) !important; }
  /* парные ячейки в главной колонке — две в ряд (родной 35px-отступ → %) */
  .bcolLeft .scell285, .bcolLeft .scell290 { width: 47% !important; margin-left: 0 !important; margin-right: 2% !important; }
}

/* ===== ТЕЛЕФОН (≤700px): одна колонка, аккуратный список ===== */
@media (max-width: 700px) {

  /* Техника скруглённых рамок использует отрицательные margin-left на РАЗНЫХ слоях.
     Обнуляем их ВСЕ (вкл. round_into/round_info) + убираем левый паддинг колонки —
     иначе слои рамки разъезжаются и появляется белая полоса слева / рвётся окантовка. */
  .round, .round2, .round3, .round4, .round5, .round6, .round_into, .round_info { margin-left: 0 !important; }
  .round6 { padding-left: 0 !important; }
  .bcolLeft, .bcolLeft2 { padding-left: 0 !important; }

  /* всё в один столбец, каждая ячейка с новой строки (margin НЕ трогаем — иначе ломаются рамки) */
  .bcolLeft, .bcolLeft2, .bcolRight, .bcolAll, .al, .pw2, .pw3,
  .scell285, .scell290, .scell570,
  .iefix, .iefix2, .iefix21, .iefix22, .iefix3 {
    float: none !important;
    width: 100% !important;
    clear: both !important;
  }

  /* лид-фото (240×180) — крупное, на всю ширину, сверху */
  .bcolLeft img[width="240"] {
    float: none !important; display: block !important;
    width: 100% !important; height: auto !important; margin: 0 0 10px 0 !important;
  }

  /* тумбнейлы новостей — компактные слева */
  .bcolLeft .imgborder, .bcolRight .imgborder {
    float: left !important; margin: 2px 10px 4px 0 !important; max-height: none !important;
  }

  /* дата/источник — под заголовком слева */
  .bcolLeft .small.gray.fr, .bcolRight .small.gray.fr,
  .bcolLeft span.fr, .bcolRight span.fr {
    float: none !important; display: inline-block !important;
  }

  /* текстовые виджеты-списки (напр. «Толкование снов») — голые div.fl-ячейки на всю ширину */
  .bcolRight .iefix3 div.fl, .bcolRight .iefix2 div.fl {
    float: none !important; width: 100% !important; margin-right: 0 !important;
  }

  /* Рекламный блок из правого сайдбара — поднять сразу под меню (порядок: реклама → статья → остальное).
     #main делаем flex-колонкой; сайдбар «распластываем» (display:contents), чтобы его прямые
     дети стали flex-элементами #main; самому блоку рекламы даём отрицательный order. Разметку не трогаем. */
  #main { display: flex !important; flex-direction: column !important; }
  #main .bcolRight { display: contents !important; }
  #main .bcolRight > noindex:has(script[src*="googlesyndication.com"]) { order: -1 !important; }
}

/* ===== Узкие телефоны (≤420px) ===== */
@media (max-width: 420px) {
  .pw, .iefixb, .bcolAll { padding-left: 4px; padding-right: 4px; }
}
