/*
 * Loaded last by every rendered page. iOS Safari zooms editable controls below
 * 16px, so these coarse-pointer rules intentionally override compact layouts.
 */
/* One sizing contract for single-line controls, including dense repeatable rows.
 * em-based growth preserves 200% text resizing; the minimum remains touch-safe.
 * Specificity intentionally exceeds the older per-section compact overrides.
 */
input:is([type="text"], [type="date"], [type="email"], [type="tel"], [type="number"], [type="search"], [type="password"], [type="url"], :not([type])),
select,
body.admin-shell-page #editForm .form-step[data-step] input:is([type="text"], [type="date"], [type="email"], [type="tel"], [type="number"], :not([type])),
body.admin-shell-page #editForm .form-step[data-step] select {
  box-sizing: border-box;
  height: max(44px, calc(1.4em + 18px)) !important;
  min-height: 44px !important;
  padding-block: 8px !important;
  line-height: 1.4 !important;
}

@media (hover: none) and (pointer: coarse) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
  select,
  textarea,
  body.admin-shell-page #editForm input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
  body.admin-shell-page #editForm select,
  body.admin-shell-page #editForm textarea {
    font-size: 16px !important;
    min-height: 44px !important;
  }

  button {
    min-width: 44px;
    min-height: 44px;
  }

  /* Keep native controls visually compact while making their label tappable. */
  input[type="checkbox"],
  input[type="radio"] {
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 20px;
  }

  label:has(input[type="checkbox"]),
  label:has(input[type="radio"]) {
    min-height: 44px;
  }
}

/*
 * Keep the native WebKit picker while constraining Safari's intrinsic date
 * control layout. The default appearance setting restores intrinsic sizing and can make
 * date fields overflow or crop their labels on iPhone and iPad.
 */
input[type="date"],
body.admin-shell-page #editForm input[type="date"] {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding-block: 8px;
  line-height: 1.4;
  -webkit-appearance: none;
  appearance: none;
  background-clip: padding-box;
  font-variant-numeric: tabular-nums;
}

input[type="date"]::-webkit-date-and-time-value,
body.admin-shell-page #editForm input[type="date"]::-webkit-date-and-time-value {
  display: block;
  width: 100%;
  min-height: 1.2em;
  margin: 0;
  text-align: left;
}

input[type="date"]::-webkit-datetime-edit,
body.admin-shell-page #editForm input[type="date"]::-webkit-datetime-edit {
  min-width: 0;
  padding: 0;
}

input[type="date"]::-webkit-calendar-picker-indicator,
body.admin-shell-page #editForm input[type="date"]::-webkit-calendar-picker-indicator {
  width: 1.25em;
  min-width: 1.25em;
  height: 1.25em;
  margin: 0;
  padding: 0;
  cursor: pointer;
}

@media (max-width: 640px) {
  .stepper {
    display: flex !important;
    flex-wrap: nowrap;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
  }

  .stepper button {
    width: auto;
    min-width: 72px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding-inline: 0 !important;
    flex: 0 0 72px !important;
    scroll-snap-align: start;
  }
}
