/* Prevent horizontal scrolling and dragging */
html, body {
  overflow-x: hidden;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

#app {
  overflow-x: hidden;
  touch-action: pan-y;
  position: relative;
  width: 100%;
  min-height: 100vh;
}

/* MOBILE SPECIFIC - Prevent drag/slide on phones but allow vertical scrolling */
@media (max-width: 768px) {
  html, body {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    touch-action: pan-y;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-overflow-scrolling: touch;
  }

  #app {
    position: relative;
    width: 100vw;
    min-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
  }

  /* Prevent drag on all mobile elements except inputs and textareas */
  *:not(input):not(textarea):not([contenteditable]) {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    touch-action: pan-y;
  }

  /* Allow text selection only in inputs and textareas */
  input, textarea, [contenteditable] {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    touch-action: auto;
  }

  /* Main content area - mobile only */
  main {
    overflow-y: auto;
    overflow-x: hidden;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
  }

  /* Chat container - allow scrolling */
  .chat-container, .space-y-4 {
    overflow-y: auto;
    overflow-x: hidden;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
  }

  /* Prevent pull-to-refresh on mobile */
  body {
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }
}

/* Desktop - allow normal interaction */
@media (min-width: 769px) {
  html, body {
    overflow-x: hidden;
    touch-action: auto;
    user-select: auto;
  }

  #app {
    overflow-x: hidden;
    touch-action: auto;
    position: relative;
  }

  * {
    touch-action: auto;
    user-select: auto;
  }

  main {
    overflow-y: auto;
    overflow-x: hidden;
    touch-action: auto;
  }
}

/* Prevent drag on all elements by default */
* {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Allow text selection in inputs and textareas */
input, textarea, [contenteditable] {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

/* Prevent horizontal scroll on iOS */
body {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

/* Main content area */
main {
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
  touch-action: pan-y;
}
