/* Phone and tablet fixes, loaded after every other stylesheet. */

/* The session column fills the space beside the chat panel; without this its
   single grid column grows to its widest content and the title and buttons
   slide under the chat on tablets and small laptops. */
body.session-detail-view .session-workspace-shell {
  grid-template-columns: minmax(0, 1fr) !important;
}

/* Tablets (761–920px): keep the project/class menu beside the content, as on
   laptops, instead of a full-screen block above it. Phones keep the drawer. */
@media (min-width: 761px) and (max-width: 920px) {
  body.project-detail-view:not(.project-ai-open):not(.project-ai-closing) .project-shell.is-research-project {
    display: grid !important;
    grid-template-columns: 210px minmax(0, 1fr) !important;
    grid-template-rows: 65px minmax(0, 1fr) !important;
  }
}

/* The files list has no timeline rail, so its empty state lines up with the list. */
#projectFileList > .timeline-empty {
  margin-left: 0 !important;
}

/* Phones: Share shows its label ("Share", "Shared · 2"), so it sizes to it. */
@media (max-width: 620px) {
  body#elthosApp.session-detail-view:not(.project-detail-view) #sessionShareButton {
    width: auto !important;
    min-width: 40px !important;
    padding: 0 12px !important;
    white-space: nowrap;
  }
}

/* iPhone and iPad Safari zoom the page into any text field under 16px. */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 1100px) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
    textarea,
    select {
      font-size: max(16px, 1em) !important;
    }
  }
}
