/* Keep dynamic task/Jarvis content within its column; wide content scrolls locally. */
@media screen and (max-width: 1100px), screen and (hover: none) and (pointer: coarse) {
  /* iOS may zoom a focused field with smaller text. Cover dynamically created
     fields too, including inline font styles, without disabling pinch zoom. */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]),
  select, textarea, [contenteditable="true"] {
    font-size: 16px !important;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }
  .shell, .shell-main, .app, .tabpane,
  .grid > *, .vwidgets > *, .edit-grid > *, .rec-grid > * {
    min-width: 0;
    max-width: 100%;
  }
  .quickadd > *, .edit-panel, .task-row > *, .project-head .left {
    min-width: 0;
    max-width: 100%;
  }
  .quickadd select, .quickadd input[type="date"] { flex-shrink: 1; }
  .task-row :is(.task-title, .task-project, .task-klant, .task-contact, .task-eigenaar) {
    overflow-wrap: anywhere;
  }
  #astPaneel, .chat-panel, #mjPaneel { min-width: 0; max-width: 100%; }
  #astPaneel :is(.ast-kop, .ast-waar, .ast-lijst, .ast-invoer, .ast-ik, .ast-hij, .ast-bevestig),
  .chat-panel :is(.chat-body, .chat-msg, .chat-input-row) {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
  #astPaneel .ast-lijst, .chat-body { min-height: 0; }
  #astPaneel .ast-ik { max-width: 85%; } /* eigen bericht blijft een ballon, maar breekt nu wel af */
  #astPaneel .ast-kop strong { min-width: 0; }
  #astPaneel .ast-bevestig .knoppen { flex-wrap: wrap; }
  #astPaneel :is(pre, table), .chat-msg :is(pre, table) {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
  #astPaneel img, .chat-msg img { max-width: 100%; height: auto; }
  .chat-input-row input { min-width: 0; }
  /* The original translateX entrance briefly extended beyond the right edge. */
  #astPaneel { animation-name: astMobileIn; }
  @keyframes astMobileIn { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
}
@media screen and (max-width: 880px) {
  .grid, .vwidgets { grid-template-columns: minmax(0, 1fr); }
}