/* -------------------------------------------------------- */
/* 🔹 Text Input                                            */
/* -------------------------------------------------------- */
/* Supports single-line and multiline modes                 */
/* Mirrors text_input.dart                                   */


/* -------------------------------------------------------- */
/* 🔹 Input Group                                           */
/* -------------------------------------------------------- */
/* Label + input pair — mirrors TextInput Column layout     */

.text-input {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}


/* -------------------------------------------------------- */
/* 🔹 Field                                                 */
/* -------------------------------------------------------- */
/* Uses .input-container from input_helpers.css for base     */
/* styling (surface, outline, radius-medium, font, color)    */

.text-input__field {
  display: block;
  width: 100%;
  height: 48px;
  padding: var(--input-padding);
  line-height: var(--text-body-medium-height);
  outline: none;
  transition: border-color 0.15s ease;
}

.text-input__field::placeholder {
  color: var(--color-on-surface-variant);
}


/* -------------------------------------------------------- */
/* 🔹 Multiline                                             */
/* -------------------------------------------------------- */
/* Textarea variant — mirrors TextInput(multiline: true)    */
/* height 160 matches Dart, resize disabled                 */

.text-input__field--multiline {
  height: 160px;
  resize: none;
  padding-top: var(--space-s);
}