/* system/apps/chat/styles.css
 *
 * Split out of index.html's shared <style> block (Sept 2026) -- see
 * start-here.md's "Each app owns its own styles.css" note for why. Nothing below
 * changed from what index.html used to have.
 *
 * Chat's message list + input row need to STRETCH full-width rather
 * than shrink-and-center the way #appMainContent's simpler
 * centered-text apps (Hello, etc.) want -- this app's own markup
 * handles that itself via an explicit width, rather than the shared
 * content region trying to guess which kind of app it's currently
 * holding.
 */

.app-chat-messages {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  text-align: left;
}

.app-chat-placeholder {
  color: var(--slate-light);
  font-family: var(--font-mono);
  font-size: var(--fs-2xs);
  line-height: 1.6;
  margin: 0 0 6px;
}

/* Toggled by apps/chat's own toggleFullBleed()/animateChatZoom()
   alongside ctx.chrome.setFullBleed() -- NOT a shell/ctx.chrome
   concept, on purpose (Sept 2026, found missing by Ron: "it doesn't
   zoom the editable area to fill the screen anymore"). ctx.chrome.
   setFullBleed() only ever controlled #appMainContent's OWN
   margin/border/padding -- it has no idea chat has a SIBLING element
   (the message log) that needs to get out of the way for the textarea
   to actually grow into the reclaimed space. In the standalone editor
   app this was never an issue: its textarea is the ONLY child, so it
   already fills 100% of whatever #appMainContent gives it. Chat's own
   layout is the one thing only chat's own code can reasonably know
   how to adjust -- correctly a chat-specific concern, not something
   to push into ctx.chrome.

   flex-grow/flex-basis, NOT display:none (changed Sept 2026, Ron's
   "zoom" animation request) -- an element that's display:none can't
   be smoothly animated to/from (there's nothing to measure a height
   for), and apps/chat's own animateChatZoom() needs a real,
   interpolatable height at every step. Shrinking to zero via flex
   achieves the same "takes no visible space" result while staying
   animatable. */
.app-chat-messages--collapsed-for-edit {
  flex-grow: 0;
  flex-basis: 0;
  overflow: hidden;
}

.app-chat-input-row {
  flex: 0 0 auto;
  width: 100%;
  box-sizing: border-box;
  border-top: 1px solid var(--line);
  padding-top: 8px;
}

/* Deliberately mirrors apps/notes's own .notes-textarea treatment
   almost exactly (both use the shared .text-input-base +
   .text-input-fill classes for the floor/reset/borderless-fill part
   -- system/lib/shared-app-styles/styles.css) -- chat was rewritten
   from scratch Sept 2026 (Ron: "there's nothing there we need to
   keep") after the original <input>-based version turned out to have
   real, hard-to-pin-down layout inconsistencies Notes' simpler
   structure never showed. A resting height rather than notes' flex:1
   0, since chat wants a compact composer with the message log taking
   most of the room at rest -- .chat-textarea--maximized below
   (toggled alongside .app-chat-messages--collapsed-for-edit above) is
   what grows it now. <textarea>, not <input> -- Ron's whole stated
   goal is arbitrarily long messages, which a single-line field can
   never really show even zoomed. */
.chat-textarea {
  flex: 0 0 auto;
  width: 100%;
  min-width: 0; /* see apps/notes's styles.css comment -- same fix, same reasoning */
  height: 84px;
  resize: none;
  padding: 8px 10px 0;
}

.chat-textarea--maximized {
  flex: 1 1 auto;
  height: auto;
}