/* HLB V5.4.1r - Mobile Upload Studio overlay/player obstruction fix */
@media (max-width: 720px) {
  /* Upload is a real modal on mobile: player/nav must not cover its fields/footer. */
  body.upload-studio-open .player-shell,
  body.upload-studio-open .mobile-nav,
  body.upload-studio-open .player-queue-drawer,
  body.upload-studio-open .mobile-now-playing {
    display: none !important;
  }

  body.upload-studio-open {
    overflow: hidden !important;
  }

  body.upload-studio-open .upload-studio-overlay {
    z-index: 20040 !important;
  }

  body.upload-studio-open .upload-studio-composer[open] {
    z-index: 20041 !important;
  }

  body.upload-studio-open .upload-studio-composer[open] > .compact-upload-panel {
    z-index: 20042 !important;
    left: 0 !important;
    right: 0 !important;
    top: max(8px, env(safe-area-inset-top, 0px)) !important;
    bottom: 0 !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    transform: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    border-radius: 24px 24px 0 0 !important;
    padding-bottom: 0 !important;
  }

  body.upload-studio-open .upload-studio-header {
    top: 0 !important;
    z-index: 20 !important;
  }

  body.upload-studio-open .upload-studio-panes {
    /* Enough breathing room so Artist can be scrolled fully above the sticky footer. */
    padding-bottom: 28px !important;
  }

  body.upload-studio-open .upload-studio-footer {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 25 !important;
    min-height: 82px !important;
    padding:
      12px
      16px
      calc(12px + env(safe-area-inset-bottom, 0px))
      16px !important;
    background: rgba(17,18,20,.985) !important;
    box-shadow: 0 -14px 34px rgba(0,0,0,.34);
  }

  body.upload-studio-open .upload-studio-footer .btn {
    min-height: 50px !important;
  }

  /* When validation scrolls to Artist/Title, keep it away from sticky header/footer. */
  body.upload-studio-open .upload-studio-field {
    scroll-margin-top: 150px;
    scroll-margin-bottom: 110px;
  }
}

@media (max-width: 460px) {
  body.upload-studio-open .upload-studio-panes {
    padding-bottom: 34px !important;
  }
}
