/* ============================================================================
   Єдина ширина контенту всіх сторінок — рівно як на головній (--page-width),
   вирівняна по хедеру. Підключається глобально з menu.php ПІСЛЯ dg-design.css,
   тож перебиває вужчі/ширші значення сторінкових стилів.
   Беремо основний контентний блок сторінки (<main> та відомі контейнери).
   ========================================================================== */

main,
.container,
.wrapper,
.content-wrap,
.top-slidercontainer,
.view-profile,
.dg-profile,
.dg-settings,
.dg-wrap {
  width: min(100% - 36px, 1324px) !important; /* = ширина шапки (.desktop-header__inner), а не 1380 */
  max-width: 1324px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Рамка контенту = ТОЧНО як на головній/хабах: 1324px (вужча за --page-width 1380).
   Нав-пігулка (.desktop-header__inner) і карпул-контент тримаємо 1324 центровано,
   щоб бічні відступи збігалися з головною. Класи специфічні для своїх сторінок
   (не повноширинні карти/слайдери): .container-trips — пошук; .trip-container —
   деталі; .content-container — мої поїздки / сповіщення. */
.desktop-header__inner,
.container-trips,
.trip-container,
.content-container {
  width: min(100% - 36px, 1324px) !important;
  max-width: 1324px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

@media (max-width: 820px) {
  main,
  .container,
  .wrapper,
  .content-wrap,
  .top-slidercontainer,
  .view-profile,
  .dg-profile,
  .dg-settings,
  .dg-wrap {
    width: min(100% - 24px, var(--page-width, 1380px)) !important;
  }
  .desktop-header__inner,
  .container-trips,
  .trip-container,
  .content-container {
    width: min(100% - 24px, 1324px) !important;
  }
}

/* ── Краї вмісту = краї шапки (комп'ютер) ──
   Ширину main задає правило вище (1324 = шапка), а власні бокові padding сторінок (16–18px)
   робили вміст вужчим за шапку. На телефоні (≤820) нічого не змінюємо — там ці поля потрібні. */
@media (min-width: 821px) {
  main {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Червневі хаби вантажів без <main>: сітка карток — на всю ширину шапки */
  section.drive:not(main section.drive) {
    width: min(100% - 36px, 1324px) !important;
    max-width: 1324px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  section.drive:not(main section.drive) .drive__grid {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}