/* Responsive zoom fixes for adventistai.lt.
 * Loaded after site-overrides.css so these rules are the final layout authority.
 */

/* 1. Keep every footer/bottom content block inside the same centred measure
   as the page body. Footer widgets are rendered outside .c-footer--inner, so
   without this they can continue moving toward the viewport edge when zooming
   out while the rest of the site stays centred. */
.l-wrap__content > .c-footer-widgets,
.l-wrap__content .c-footer-widgets,
.l-wrap__content > footer.c-footer > .c-footer--inner {
  width: 100% !important;
  max-width: var(--site-measure, min(100%, 90rem)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.l-wrap__content > .c-footer-widgets,
.l-wrap__content .c-footer-widgets {
  padding-left: var(--site-gutter, 1.25rem) !important;
  padding-right: var(--site-gutter, 1.25rem) !important;
}

/* Do not allow footer text/nav/address content to escape its own column. */
.c-footer--inner > *,
.c-footer-widgets > *,
.c-footer__description-text,
.c-footer__legal,
.c-footer__address,
.c-footer__primary-nav,
.c-footer__secondary-nav {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere;
}

/* ALPS positions the legal/address block absolutely on desktop. Make the
   centred footer measure its containing block, otherwise the address is
   positioned against the full-width footer and sits on the viewport edge. */
@media (min-width: 901px) {
  .l-wrap .c-footer--inner {
    position: relative !important;
  }
}

/* 2. Keep the Sabbath rail and logo tied to one consistent geometry.
   Browser zoom fires resize events and crosses ALPS breakpoints, so viewport,
   parent and JavaScript-calculated pixel widths must not be mixed here. */

/* A reserved root scrollbar gutter is painted with the page background. At
   high zoom its physical width becomes a conspicuous white strip beside the
   rail, so let the browser place the scrollbar at the viewport edge normally. */
html {
  scrollbar-gutter: auto !important;
}

.l-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: clip;
}

.l-wrap__content {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
}

/* The content takes the available space and the rail takes exactly the final
   seventh of the same flex row. Its right edge is therefore the row's edge. */
.l-wrap__sabbath.l-sabbath {
  flex: 0 0 calc(100% / 7) !important;
  width: calc(100% / 7) !important;
  min-width: 0 !important;
  max-width: calc(100% / 7) !important;
  margin: 0 !important;
  overflow: clip !important;
}

/* Below 701px ALPS changes this pseudo-element from fixed to absolute.
   Absolute percentages are relative to the rail, while fixed percentages are
   relative to the viewport, so each mode needs its corresponding full width. */
.l-sabbath.u-background-image--sabbath::after {
  right: 0 !important;
  left: auto !important;
  width: 100% !important;
}

@media (min-width: 701px) {
  .l-sabbath.u-background-image--sabbath::after {
    width: calc(100vw / 7) !important;
  }
}

/* The JS sticky helper stores pixel left/width values and recalculates them on
   browser zoom. The logo no longer opts into that helper; native sticky keeps
   it in its ALPS top position without horizontal jumps. */
.l-sabbath__logo {
  position: sticky !important;
  top: 0;
  left: auto !important;
  right: auto !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  aspect-ratio: 1 / 1;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  z-index: 2;
}

/* Official signage uses a seven-unit square with the Adventist symbol five
   units wide. This leaves one unit of protected space on each side and keeps
   the same physical proportion when browser zoom changes. */
.l-sabbath__logo--inner,
.l-sabbath__logo > img.style-svg {
  display: block !important;
  width: 71.4285714286% !important;
  min-width: 0 !important;
  max-width: 71.4285714286% !important;
  height: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.l-sabbath__logo--inner {
  position: relative;
  transition: opacity .25s ease !important;
}

.l-sabbath__logo--inner > div,
.l-sabbath__logo--inner svg,
.l-sabbath__logo--inner img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}

/* 3. Keep the desktop article/sidebar split on normal wide screens.
   Only stack the sidebar once the effective viewport is genuinely narrow.
   The previous 1200px cutoff was too early and moved desktop widget columns
   below the article on otherwise wide layouts. */
@media (max-width: 1000px) {
  .l-main__content > .c-article,
  .l-main__content > .c-sidebar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}

/* Anti-overlap containment remains active a little earlier, but it does not
   change the article/sidebar geometry. This prevents long content and wide
   blocks from extending beneath the Sabbath rail during zoom-in. */
@media (max-width: 1200px) {
  .l-main__content,
  .c-page-header__long--inner,
  .c-page-header__simple--inner,
  .c-footer--inner {
    min-width: 0 !important;
    overflow: hidden;
  }

  .text,
  .text p,
  .text li,
  .text h1,
  .text h2,
  .text h3,
  .text h4,
  .text h5,
  .text h6,
  .c-block__title,
  .c-block__heading-title,
  .c-footer--inner,
  .c-footer-widgets {
    max-width: 100% !important;
    overflow-wrap: anywhere;
    word-break: normal !important;
  }

  .text > .alignwide,
  .text .wp-block-column > .alignwide,
  .text > .alignfull {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
  }
}