/* ArezzoMT2 v176 - prezentacja na telefonie jak na komputerze
   Cel: telefon ma renderować prezentację w układzie desktopowym, a nie w uproszczonym mobile.
   Dzięki temu boczny panel, tło i sama prezentacja wyglądają jak na PC.
*/

/* Stabilny desktopowy viewport / układ */
html,
body.az126-presentation-page,
body.az125-presentation-page {
  min-width: 1280px !important;
  overflow-x: auto !important;
}

/* Zawsze zostaje lewy panel jak na komputerze, również na telefonie. */
body.az126-presentation-page,
body.az125-presentation-page {
  padding-left: 318px !important;
  padding-top: 0 !important;
}

/* Cofnięcie mobilnego paska u góry z wcześniejszych wersji. */
.az167-side,
.az168-side,
.az169-side,
.az170-side {
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  right: auto !important;
  width: 318px !important;
  height: 100vh !important;
  z-index: 999 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 20px 17px 16px !important;
  border-right: 1px solid rgba(255, 63, 86, .42) !important;
  border-bottom: 0 !important;
}

/* Logo i lista kategorii tak jak na desktopie. */
.az167-logo {
  height: 64px !important;
  min-height: 64px !important;
  margin: 0 0 12px !important;
}

.az167-logo img {
  max-width: 170px !important;
  max-height: 62px !important;
}

.az167-nav,
.az168-nav,
.az169-nav,
.az170-nav {
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 0 4px 0 0 !important;
}

.az167-nav-group,
.az168-nav-group,
.az169-nav-group,
.az170-nav-group {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 0 9px !important;
}

.az167-nav-title {
  display: block !important;
}

.az167-nav-group a,
.az168-nav-group a,
.az169-nav-group a,
.az170-nav-group a {
  flex: none !important;
  min-height: 27px !important;
  margin: 0 0 4px !important;
  padding: 0 9px 0 22px !important;
  font-size: 10.8px !important;
  white-space: normal !important;
}

.az167-actions,
.az168-actions,
.az169-actions,
.az170-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
}

/* Treść prezentacji zostaje w desktopowej szerokości. */
.az126-presentation-page .azp-presentation {
  padding-top: 28px !important;
}

.az126-presentation-page .azp-wrap {
  width: 1120px !important;
  max-width: 1120px !important;
  min-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.az126-presentation-page .azp-frame {
  max-width: 1100px !important;
  margin: 0 auto !important;
}

/* Obrazki nie mają być miniaturowane do szerokości telefonu, tylko do desktopowego kontenera. */
.az126-presentation-page .azp-image-block img,
.az126-presentation-page .azp-image-row img,
.az126-presentation-page .azp-content img {
  max-width: 100% !important;
  height: auto !important;
}

/* Wymuszenie desktopowego układu nawet w zakresach mobile z poprzednich CSS. */
@media (max-width: 820px) {
  html,
  body.az126-presentation-page,
  body.az125-presentation-page {
    min-width: 1280px !important;
    overflow-x: auto !important;
  }

  body.az126-presentation-page,
  body.az125-presentation-page {
    padding-left: 318px !important;
    padding-top: 0 !important;
  }

  .az167-side,
  .az168-side,
  .az169-side,
  .az170-side {
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    right: auto !important;
    width: 318px !important;
    height: 100vh !important;
    padding: 20px 17px 16px !important;
    border-right: 1px solid rgba(255, 63, 86, .42) !important;
    border-bottom: 0 !important;
    box-shadow:
      18px 0 48px rgba(0,0,0,.46),
      0 0 42px rgba(160, 35, 55, .12),
      inset -1px 0 0 rgba(255,255,255,.025) !important;
  }

  .az167-nav,
  .az168-nav,
  .az169-nav,
  .az170-nav {
    display: block !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 4px 0 0 !important;
  }

  .az167-nav-group,
  .az168-nav-group,
  .az169-nav-group,
  .az170-nav-group {
    display: block !important;
  }

  .az167-nav-title {
    display: block !important;
  }

  .az167-actions,
  .az168-actions,
  .az169-actions,
  .az170-actions {
    display: grid !important;
  }

  .az126-presentation-page .azp-wrap {
    width: 1120px !important;
    max-width: 1120px !important;
    min-width: 1120px !important;
  }
}
