/* Mobile Input Zoom Prevention Fix */
/* Prevents browser auto-zoom when clicking inputs on mobile devices */
/* See: https://css-tricks.com/16px-or-larger-font-size-input-boxes-no-ios-zoom/ */

/* Mobile (max-width: 767px): Use 16px to prevent browser auto-zoom */
/* Excludes field mode inputs which have intentionally larger font sizes */
@media (max-width: 767px) {
  input:not(.field-input):not(.field-input-distance):not(.field-select),
  textarea:not(.field-input),
  select:not(.field-select),
  [type="text"]:not(.field-input),
  [type="email"]:not(.field-input),
  [type="password"]:not(.field-input),
  [type="number"]:not(.field-input):not(.field-input-distance),
  [type="tel"]:not(.field-input),
  [type="date"]:not(.field-input),
  [type="time"]:not(.field-input),
  [type="search"]:not(.field-input),
  [type="url"]:not(.field-input),
  [type="color"]:not(.field-input),
  [type="file"]:not(.field-input) {
    font-size: 16px !important;
  }

  /* Ensure custom components inherit the fix (not field mode) */
  .trecker-input,
  .TreckerInput,
  .TreckerTextarea,
  .TreckerSelect,
  .form-control,
  .input-group > input,
  .input-group > select,
  .input-group > textarea {
    font-size: 16px !important;
  }
}

/* Tablet & Desktop (min-width: 768px): Smaller sizes are safe from zoom */
@media (min-width: 768px) {
  input,
  textarea,
  select,
  [type="text"],
  [type="email"],
  [type="password"],
  [type="number"],
  [type="tel"],
  [type="date"],
  [type="time"],
  [type="search"],
  [type="url"],
  [type="color"],
  [type="file"] {
    font-size: 14px;
  }

  /* Ensure custom components use desktop sizing */
  .trecker-input,
  .TreckerInput,
  .TreckerTextarea,
  .TreckerSelect,
  .form-control,
  .input-group > input,
  .input-group > select,
  .input-group > textarea {
    font-size: 14px;
  }
}
