/*
 * Phase 7 mobile compatibility layer.
 *
 * These rules load after the preserved 2.4 compiled stylesheet. They are
 * deliberately scoped to the runtime's compact-mobile class so desktop
 * positioning, docking and interactive-tour behavior remain unchanged.
 */

.a1osis-phase7-equipment-library,
.software-tour-dialog,
.pwa-install-button {
  -webkit-tap-highlight-color: transparent;
}

html.a1osis-phase7-mobile {
  scroll-padding-bottom: calc(
    var(--a1osis-phase7-tour-sheet-height, 0px) + 18px
  );
}

html.a1osis-phase7-mobile .software-tour-backdrop.a1osis-phase7-mobile-tour {
  align-items: flex-end !important;
  background: linear-gradient(
    to bottom,
    rgba(0, 5, 10, 0.34),
    rgba(0, 5, 10, 0.76)
  ) !important;
  display: flex !important;
  inset: 0 !important;
  justify-content: stretch !important;
  overflow: hidden !important;
  padding: 0 !important;
  pointer-events: none !important;
  position: fixed !important;
  z-index: 30000 !important;
}

html.a1osis-phase7-mobile
  .software-tour-dialog.a1osis-phase7-mobile-tour-sheet {
  background:
    radial-gradient(circle at 90% 0, rgba(39, 211, 255, 0.16), transparent 18rem),
    #051522 !important;
  border: 1px solid rgba(39, 211, 255, 0.58) !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  border-radius: 20px 20px 0 0 !important;
  border-right: 0 !important;
  bottom: 0 !important;
  box-sizing: border-box !important;
  height: auto !important;
  inset: auto 0 0 !important;
  left: 0 !important;
  margin: 0 !important;
  max-height: min(64vh, 620px) !important;
  max-height: min(64dvh, 620px) !important;
  max-width: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  padding: 10px 18px calc(12px + env(safe-area-inset-bottom)) !important;
  pointer-events: auto !important;
  position: fixed !important;
  right: 0 !important;
  scroll-padding-bottom: calc(74px + env(safe-area-inset-bottom));
  scrollbar-gutter: stable;
  top: auto !important;
  transform: none !important;
  transition: transform 180ms ease !important;
  visibility: visible !important;
  width: 100% !important;
  z-index: 30010 !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  .software-tour-skip {
  align-items: center;
  background: #071b2b !important;
  border: 1px solid rgba(145, 168, 182, 0.55) !important;
  border-radius: 999px;
  color: #d6e5ed !important;
  display: flex !important;
  float: none !important;
  justify-content: center;
  margin: 0 0 4px auto !important;
  min-height: 44px;
  padding: 8px 14px !important;
  position: sticky !important;
  right: auto !important;
  top: 0 !important;
  width: max-content;
  z-index: 4;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  > p {
  font-size: 8px !important;
  line-height: 1.4;
  margin: 8px 0 0 !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  .software-tour-tool {
  margin: 10px 0 6px !important;
  min-height: 44px;
  padding: 8px 11px !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  h2 {
  font-size: clamp(25px, 8vw, 34px) !important;
  line-height: 1.05;
  margin: 10px 0 !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  > span {
  font-size: 13px !important;
  line-height: 1.55 !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  > small {
  font-size: 9px !important;
  line-height: 1.5 !important;
  margin-top: 10px !important;
  padding: 9px 11px !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  .software-tour-progress {
  gap: 5px !important;
  margin: 14px 0 10px !important;
  overflow-x: auto;
  padding: 2px;
  scrollbar-width: thin;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  .software-tour-progress
  i {
  flex: 0 0 min(34px, 10vw);
  height: 4px;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  > nav {
  align-items: stretch !important;
  background:
    linear-gradient(to bottom, rgba(5, 21, 34, 0), #051522 14px),
    #051522;
  bottom: calc(-12px - env(safe-area-inset-bottom));
  display: grid !important;
  gap: 8px !important;
  grid-auto-columns: minmax(0, 1fr);
  grid-auto-flow: column;
  margin: 6px -18px calc(-12px - env(safe-area-inset-bottom)) !important;
  padding: 18px 18px calc(12px + env(safe-area-inset-bottom));
  position: sticky;
  z-index: 5;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-mobile-tour-sheet
  > nav
  button {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 48px;
  padding: 10px 12px !important;
  width: 100%;
}

html.a1osis-phase7-mobile .software-tour-target {
  scroll-margin-block: 14px
    calc(var(--a1osis-phase7-tour-sheet-height, 58dvh) + 18px);
  z-index: 29990 !important;
}

html.a1osis-phase7-mobile
  .software-tour-dialog:focus-visible,
html.a1osis-phase7-mobile
  .software-tour-dialog
  button:focus-visible,
html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  button:focus-visible,
html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  input:focus-visible,
html.a1osis-phase7-mobile
  .pwa-install-button:focus-visible {
  outline: 3px solid #e9ae3b !important;
  outline-offset: 3px !important;
}

html.a1osis-phase7-mobile .a1osis-phase7-equipment-library {
  background: #061420 !important;
  border: 1px solid rgba(39, 211, 255, 0.5);
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  bottom: 0 !important;
  box-shadow: 0 -18px 55px rgba(0, 0, 0, 0.62) !important;
  box-sizing: border-box;
  display: grid !important;
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  height: min(54vh, 520px) !important;
  height: min(54dvh, 520px) !important;
  inset: auto 8px 0 !important;
  left: 8px !important;
  max-height: min(54vh, 520px) !important;
  max-height: min(54dvh, 520px) !important;
  max-width: none !important;
  min-height: 220px;
  overflow: hidden !important;
  padding-bottom: env(safe-area-inset-bottom);
  position: fixed !important;
  right: 8px !important;
  top: auto !important;
  transform: none !important;
  transition:
    transform 180ms ease,
    visibility 180ms ease !important;
  width: auto !important;
  z-index: 25000 !important;
}

html.a1osis-phase7-mobile
  .studio-workspace.library-closed
  .a1osis-phase7-equipment-library {
  pointer-events: none !important;
  transform: translateY(calc(100% + 24px)) !important;
  visibility: hidden !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-drag-handle {
  cursor: default !important;
  touch-action: pan-y !important;
  user-select: text;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .studio-panel-heading {
  min-height: 56px;
  padding:
    8px
    10px !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .studio-panel-heading
  small {
  display: block;
  font-size: 8px;
  line-height: 1.4;
  margin-top: 3px;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-dock-controls
  button {
  min-height: 44px;
  min-width: 44px;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-dock-controls
  button:not(:last-child) {
  display: none !important;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .legend-presets {
  max-height: 76px;
  overflow: hidden;
  padding: 8px 10px 0;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .legend-presets
  button,
html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-categories
  button {
  min-height: 36px;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-search {
  box-sizing: border-box;
  font-size: 16px;
  margin: 8px 10px;
  min-height: 44px;
  width: calc(100% - 20px);
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-categories {
  min-height: 46px;
  padding: 0 10px 8px;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-results {
  height: auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain;
  padding: 0 10px calc(12px + env(safe-area-inset-bottom));
  scrollbar-gutter: stable;
}

html.a1osis-phase7-mobile
  .a1osis-phase7-equipment-library
  .library-results
  > button {
  min-height: 48px;
}

html.a1osis-phase7-mobile
  body.a1osis-phase7-library-tour-step
  .a1osis-phase7-equipment-library {
  border: 1px solid #e9ae3b !important;
  border-radius: 14px;
  bottom: auto !important;
  height: min(30vh, 260px) !important;
  height: min(30dvh, 260px) !important;
  inset: calc(8px + env(safe-area-inset-top)) 8px auto !important;
  max-height: min(30vh, 260px) !important;
  max-height: min(30dvh, 260px) !important;
  top: calc(8px + env(safe-area-inset-top)) !important;
  z-index: 29990 !important;
}

html.a1osis-phase7-mobile
  body.a1osis-phase7-library-tour-step
  .a1osis-phase7-equipment-library
  .legend-presets {
  display: none;
}

html.a1osis-phase7-mobile
  body.a1osis-phase7-library-tour-step
  .a1osis-phase7-equipment-library
  .library-search {
  margin-block: 6px;
}

html.a1osis-phase7-mobile
  .pwa-install-button.a1osis-phase7-install-cta {
  bottom: auto !important;
  box-sizing: border-box;
  left: auto !important;
  margin: 22px 16px calc(30px + env(safe-area-inset-bottom)) !important;
  max-width: none !important;
  min-height: 64px;
  position: relative !important;
  right: auto !important;
  top: auto !important;
  width: calc(100% - 32px) !important;
  z-index: auto !important;
}

html.a1osis-phase7-mobile
  .pwa-install-button.a1osis-phase7-install-cta
  small {
  font-size: 10px;
}

@media (orientation: landscape) and (max-height: 560px) {
  html.a1osis-phase7-mobile
    .software-tour-dialog.a1osis-phase7-mobile-tour-sheet {
    max-height: min(70vh, 390px) !important;
    max-height: min(70dvh, 390px) !important;
  }

  html.a1osis-phase7-mobile
    .a1osis-phase7-mobile-tour-sheet
    h2 {
    font-size: 24px !important;
  }

  html.a1osis-phase7-mobile .a1osis-phase7-equipment-library {
    height: min(58vh, 320px) !important;
    height: min(58dvh, 320px) !important;
    max-height: min(58vh, 320px) !important;
    max-height: min(58dvh, 320px) !important;
    min-height: 0;
  }

  html.a1osis-phase7-mobile
    .a1osis-phase7-equipment-library
    .legend-presets {
    display: none;
  }

  html.a1osis-phase7-mobile
    body.a1osis-phase7-library-tour-step
    .a1osis-phase7-equipment-library {
    height: min(25vh, 150px) !important;
    height: min(25dvh, 150px) !important;
    min-height: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.a1osis-phase7-mobile
    .software-tour-dialog.a1osis-phase7-mobile-tour-sheet,
  html.a1osis-phase7-mobile .a1osis-phase7-equipment-library {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

@media print {
  .a1osis-phase7-equipment-library,
  .software-tour-backdrop,
  .pwa-install-button {
    display: none !important;
  }
}
