/* ArezzoMT2 v177 - przywrócenie górnego panelu prezentacji
   Cel: po v176 prezentacja ma desktopowy układ na telefonie, ale górne menu ma być widoczne.
*/

/* Nadpisanie wcześniejszych reguł, które ukrywały górny panel. */
header.az126-presentation-topbar.az177-presentation-topbar,
header.az161-presentation-topbar.az177-presentation-topbar,
.az126-presentation-topbar.az177-presentation-topbar,
.az161-presentation-topbar.az177-presentation-topbar {
  display: flex !important;
  position: fixed !important;
  top: 0 !important;
  left: 318px !important;
  right: 0 !important;
  width: auto !important;
  min-width: 962px !important;
  height: 66px !important;
  min-height: 66px !important;
  z-index: 998 !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 28px !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 63, 86, .78) !important;
  border-radius: 0 !important;
  background: rgba(7, 8, 15, .88) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.30) !important;
  box-sizing: border-box !important;
}

/* Logo w górnym pasku ukrywamy, bo logo jest już w lewym panelu. */
.az177-presentation-topbar .az74-brand {
  display: none !important;
}

/* Menu górne identyczne stylistycznie jak na głównej. */
.az177-presentation-topbar .az74-menu {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
  width: auto !important;
  max-width: 1160px !important;
  min-height: 66px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
}

.az177-presentation-topbar .az74-menu > a {
  min-width: 148px !important;
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  border-radius: 3px !important;
  border: 1px solid rgba(255, 63, 86, .88) !important;
  background: linear-gradient(180deg, rgba(24, 18, 30, .98), rgba(10, 9, 18, .99)) !important;
  color: #f5ead8 !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.72) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 0 0 1px rgba(255,63,86,.08) !important;
  box-sizing: border-box !important;
}

.az177-presentation-topbar .az74-menu > a:hover {
  border-color: rgba(255, 95, 104, .98) !important;
  background: linear-gradient(180deg, rgba(71, 28, 40, .98), rgba(17, 12, 22, .99)) !important;
  color: #fff1de !important;
}

.az177-presentation-topbar .az74-menu > a.az157-menu-accent-soft {
  border-color: rgba(255, 63, 86, .96) !important;
  background: linear-gradient(180deg, rgba(72, 28, 42, .98), rgba(21, 12, 21, .99)) !important;
}

.az177-presentation-topbar .az74-menu > a.az157-menu-accent {
  border-color: rgba(255, 83, 90, 1) !important;
  background: linear-gradient(180deg, rgba(205, 67, 56, .98), rgba(118, 36, 40, .99)) !important;
}

/* Body i treść mają zejść pod górny panel. */
body.az126-presentation-page,
body.az125-presentation-page {
  padding-left: 318px !important;
  padding-top: 66px !important;
}

/* Lewy panel zostaje od góry do dołu, topbar zaczyna się dopiero obok niego. */
.az167-side,
.az168-side,
.az169-side,
.az170-side {
  top: 0 !important;
  height: 100vh !important;
  z-index: 999 !important;
}

/* Treść prezentacji ma nie wchodzić pod górny panel. */
.az126-presentation-page .azp-presentation {
  padding-top: 28px !important;
}

/* Desktop view na telefonie też ma mieć górny panel. */
@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: 66px !important;
  }

  header.az126-presentation-topbar.az177-presentation-topbar,
  header.az161-presentation-topbar.az177-presentation-topbar,
  .az126-presentation-topbar.az177-presentation-topbar,
  .az161-presentation-topbar.az177-presentation-topbar {
    display: flex !important;
    position: fixed !important;
    top: 0 !important;
    left: 318px !important;
    right: 0 !important;
    width: auto !important;
    min-width: 962px !important;
    height: 66px !important;
    padding: 0 28px !important;
    border-bottom: 1px solid rgba(255, 63, 86, .78) !important;
  }

  .az177-presentation-topbar .az74-menu {
    flex-wrap: nowrap !important;
    gap: 12px !important;
  }

  .az177-presentation-topbar .az74-menu > a {
    min-width: 148px !important;
    min-height: 38px !important;
    font-size: 12px !important;
    letter-spacing: .12em !important;
    padding: 0 18px !important;
  }
}
