/* oMATIC Minds v0.6.8.44 Image Studio mobile scroll lane / action clearance.
   Loaded last. This targets the actual scrolling message lane so generated image details,
   reference chips, Download/Delete, and the phone composer toggle can be scrolled fully into view. */

@media (max-width: 640px) {
  body.om-image-studio-route.om-chat-shell-route {
    --om-image-studio-composer-clearance: 360px !important;
    --om-image-mobile-left-rail: 58px !important;
    --om-image-mobile-right-pad: 8px !important;
  }

  /* Image Studio must not inherit the Minds Chat mobile header/message inset stack. */
  body.om-image-studio-route.om-chat-shell-route .om-chat-messages,
  body.om-image-studio-route .om-image-studio-messages {
    position: absolute !important;
    inset: 0 0 0 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: block !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    box-sizing: border-box !important;
    padding: 0 var(--om-image-mobile-right-pad, 8px) calc(var(--om-image-studio-composer-clearance, 360px) + 170px) 0 !important;
    scroll-padding-top: 0 !important;
    scroll-padding-bottom: calc(var(--om-image-studio-composer-clearance, 360px) + 170px) !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  /* Remove the auto-bottom anchoring that was pushing generated cards down into the composer. */
  body.om-image-studio-route .om-image-studio-messages > .om-image-generation-grid,
  body.om-image-studio-route.om-chat-shell-route .om-chat-messages > .om-image-generation-grid {
    width: min(100%, calc(100vw - var(--om-image-mobile-left-rail, 58px) - var(--om-image-mobile-right-pad, 8px))) !important;
    max-width: min(100%, calc(100vw - var(--om-image-mobile-left-rail, 58px) - var(--om-image-mobile-right-pad, 8px))) !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 10px 0 calc(var(--om-image-studio-composer-clearance, 360px) + 180px) 0 !important;
    align-self: auto !important;
    box-sizing: border-box !important;
  }

  body.om-image-studio-route .om-image-generation-grid {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
  }

  body.om-image-studio-route .om-image-generation-card,
  body.om-image-studio-route .om-image-generation-card.chatgpt-style,
  body.om-image-phone-composer-closed.om-image-studio-route .om-image-generation-card,
  body.om-image-phone-composer-closed.om-image-studio-route .om-image-generation-card.chatgpt-style {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 150px 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    transform: none !important;
    justify-self: auto !important;
    align-self: center !important;
    box-sizing: border-box !important;
  }

  body.om-image-studio-route .om-image-generation-card.chatgpt-style .om-image-generation-body.image-card-minimal,
  body.om-image-studio-route .om-image-generation-card.chatgpt-style .om-image-generation-reference-note,
  body.om-image-studio-route .om-image-generation-card.chatgpt-style .om-image-generation-actions.split-actions {
    position: relative !important;
    z-index: 20 !important;
    pointer-events: auto !important;
  }

  body.om-image-studio-route .om-image-generation-actions.split-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    width: 100% !important;
  }

  body.om-image-studio-route .om-image-generation-actions.split-actions > *,
  body.om-image-studio-route .om-image-generation-actions.split-actions form,
  body.om-image-studio-route .om-image-generation-actions.split-actions button,
  body.om-image-studio-route .om-image-generation-actions.split-actions .button,
  body.om-image-studio-route .om-image-generation-actions.split-actions details,
  body.om-image-studio-route .om-image-generation-actions.split-actions summary {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    box-sizing: border-box !important;
  }

  /* Closed composer: still leave enough scroll tail so chips/actions are not trapped at the bottom. */
  body.om-image-phone-composer-closed.om-image-studio-route {
    --om-image-studio-composer-clearance: 92px !important;
  }

  body.om-image-phone-composer-closed.om-image-studio-route.om-chat-shell-route .om-chat-messages,
  body.om-image-phone-composer-closed.om-image-studio-route .om-image-studio-messages {
    padding-bottom: 250px !important;
    scroll-padding-bottom: 250px !important;
  }

  body.om-image-phone-composer-closed.om-image-studio-route .om-image-studio-messages > .om-image-generation-grid,
  body.om-image-phone-composer-closed.om-image-studio-route.om-chat-shell-route .om-chat-messages > .om-image-generation-grid {
    padding-bottom: 260px !important;
  }

  body.om-image-phone-composer-closed.om-image-studio-route .om-image-generation-card,
  body.om-image-phone-composer-closed.om-image-studio-route .om-image-generation-card.chatgpt-style {
    margin-bottom: 220px !important;
  }

  /* Keep the small Show typing tool tab out of the content lane. */
  body.om-image-phone-composer-closed.om-image-studio-route .om-image-studio-composer-shell {
    right: 12px !important;
    bottom: 12px !important;
    width: 180px !important;
    z-index: 160 !important;
  }
}