/*
 * reTEST Single Stability 6.2.7
 * Ostatnia warstwa wyłącznie dla geometrii strony wpisu.
 * Cel: identyczny szkielet dla recenzji, newsów, poradników i archiwalnych treści.
 */

:root {
  --retest-single-frame: 1480px;
  --retest-single-sidebar: 320px;
  --retest-single-gap: clamp(24px, 2.2vw, 34px);
}

/* Jeden frame dla hero, paska akcji, CTA i właściwej treści. */
.single-article-page .article-hero > .container,
.single-article-page .article-ad-section > .container,
.single-article-page .article-layout[data-retest-layout="stable-v627"] {
  box-sizing: border-box !important;
  width: min(calc(100% - 48px), var(--retest-single-frame)) !important;
  max-width: var(--retest-single-frame) !important;
  margin-inline: auto !important;
}

/* Desktop: grid nie może zawinąć sidebara do następnego wiersza. */
@media (min-width: 1081px) {
  .single-article-page .article-layout[data-retest-layout="stable-v627"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--retest-single-sidebar) !important;
    grid-template-rows: auto !important;
    grid-auto-flow: row !important;
    align-items: start !important;
    justify-content: stretch !important;
    gap: var(--retest-single-gap) !important;
    padding-top: clamp(8px, 1.3vw, 18px) !important;
  }

  .single-article-page .article-layout[data-retest-layout="stable-v627"] > .article-main-column {
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
  }

  .single-article-page .article-layout[data-retest-layout="stable-v627"] > .article-sidebar {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
    position: relative !important;
    inset: auto !important;
    width: var(--retest-single-sidebar) !important;
    min-width: 0 !important;
    max-width: var(--retest-single-sidebar) !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    overflow: visible !important;
    align-self: start !important;
  }

  /* Sticky nie jest już osobnym scrollem. Eliminuje przejmowanie kółka myszy
     oraz efekt odbijania dokumentu. Przewijana jest wyłącznie lista TOC. */
  .single-article-page .article-sidebar > .article-sidebar__sticky {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    position: sticky !important;
    top: var(--article-sticky-offset, 110px) !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
    scrollbar-width: auto !important;
  }

  .single-article-page .article-sidebar > .article-sidebar__sticky::-webkit-scrollbar {
    display: none !important;
  }

  .single-article-page .article-toc-mobile {
    display: none !important;
  }
}

/* Tylko lista spisu treści może mieć własny scrollbar. */
.single-article-page .article-toc-card {
  min-width: 0 !important;
  max-width: 100% !important;
}

.single-article-page .article-toc-card > ol {
  box-sizing: border-box !important;
  max-height: min(42dvh, 430px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: auto !important;
  scroll-behavior: auto !important;
}

.single-article-page .article-sidebar-ad {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 18px 0 0 !important;
}

/* Każdy blok końcowy pozostaje ograniczony do kolumny tekstu. */
.single-article-page .article-main-column > *,
.single-article-page .article-content,
.single-article-page .article-author-card,
.single-article-page .article-end,
.single-article-page .article-google-source--after-content,
.single-article-page .article-awards-showcase {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* Tablet/mobile: sidebar znika całkowicie. Nie może utworzyć drugiego wiersza. */
@media (max-width: 1080px) {
  .single-article-page .article-layout[data-retest-layout="stable-v627"] {
    display: block !important;
    width: min(calc(100% - 36px), 980px) !important;
    max-width: 980px !important;
  }

  .single-article-page .article-layout[data-retest-layout="stable-v627"] > .article-main-column {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  .single-article-page .article-layout[data-retest-layout="stable-v627"] > .article-sidebar {
    display: none !important;
  }

  .single-article-page .article-toc-mobile {
    display: block !important;
  }
}

@media (max-width: 640px) {
  .single-article-page .article-hero > .container,
  .single-article-page .article-ad-section > .container,
  .single-article-page .article-layout[data-retest-layout="stable-v627"] {
    width: min(calc(100% - 24px), var(--retest-single-frame)) !important;
  }
}