/* V0.15.10.46 - shared non-Performance-Lab account and public forms.
 * Keep the control with its own label and hint; no bottom alignment of fields. */
.st-outside-forms .form-card .form-grid,
.st-outside-forms .registration-form-card .form-grid,
.st-outside-forms .shop-editor .form-grid,
.st-outside-forms .form-grid-2,
.st-outside-forms .form-grid-3,
.st-outside-forms .form-grid-5 {
  align-items:start;
  min-width:0;
}
.st-outside-forms .form-card .form-grid {grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px;column-gap:18px}
.st-outside-forms .form-card .form-grid > label,
.st-outside-forms .form-card > label.full-label,
.st-outside-forms .profile-editor-form .form-grid > label {
  min-width:0;max-width:100%;display:flex;flex-direction:column;
  align-items:stretch;justify-content:flex-start;align-self:start;
  gap:8px;line-height:1.4;
}
.st-outside-forms .form-card .form-grid > label > input:not([type="checkbox"]):not([type="date"]):not([type="time"]):not([type="datetime-local"]),
.st-outside-forms .form-card .form-grid > label > select,
.st-outside-forms .form-card .form-grid > label > textarea,
.st-outside-forms .form-card > label.full-label > input:not([type="checkbox"]):not([type="date"]):not([type="time"]):not([type="datetime-local"]),
.st-outside-forms .form-card > label.full-label > textarea {
  display:block;box-sizing:border-box;min-width:0;max-width:100%;flex:none;
  margin:0;align-self:stretch;
}
.st-outside-forms .form-card .form-grid .form-hint,
.st-outside-forms .form-card .form-grid label small,
.st-outside-forms .form-card > label.full-label .form-hint {
  display:block;position:static;min-width:0;max-width:100%;margin:0;
  text-align:left;line-height:1.5;overflow-wrap:anywhere;align-self:stretch;
}
.st-outside-forms .form-card :is(input,select,textarea) {box-sizing:border-box;min-width:0}
/* V0.15.10.47 — iPadOS WebKit native temporal-control repair.
 * WebKit issue 139848: display:block on date/time/datetime-local controls
 * vertically top-aligns the displayed native value on iOS. The universal
 * text-input block rule above therefore excludes these native controls.
 * Restore WebKit's native inline-flex host layout without replacing the
 * date/time picker or modifying any Performance Lab controls. */
.st-outside-forms main :is(input[type="date"],input[type="time"],input[type="datetime-local"]),
.st-outside-forms .form-card .form-grid > label > :is(input[type="date"],input[type="time"],input[type="datetime-local"]),
.st-outside-forms .form-card > label.full-label > :is(input[type="date"],input[type="time"],input[type="datetime-local"]) {
  display:inline-flex;
  box-sizing:border-box;
  align-items:center;
  justify-content:flex-start;
  align-self:flex-start;
  flex:none;
  min-width:0;
  max-width:100%;
  margin:0;
  height:52px;
  min-height:52px;
  line-height:normal;
  vertical-align:middle;
  font-variant-numeric:tabular-nums;
}
.st-outside-forms .form-card :is(input[type="date"],input[type="time"]) {
  width:176px;
  max-width:100%;
}
.st-outside-forms .form-card input[type="datetime-local"] {
  width:255px;
  max-width:100%;
}
/* iOS renders a single -webkit-date-and-time-value pseudo-element, unlike
 * the segmented desktop editor. Keep its natural line box and inherit text
 * alignment, matching current WebKit/Tailwind preflight guidance. */
.st-outside-forms main :is(input[type="date"],input[type="time"],input[type="datetime-local"])::-webkit-date-and-time-value {
  min-height:1lh;
  text-align:inherit;
  margin-block:auto;
}
.st-outside-forms main :is(input[type="date"],input[type="time"],input[type="datetime-local"])::-webkit-datetime-edit {
  display:inline-flex;
  align-items:center;
  padding-block:0;
}
.st-outside-forms main :is(input[type="date"],input[type="time"],input[type="datetime-local"])::-webkit-datetime-edit-fields-wrapper {
  padding-block:0;
}
.st-outside-forms .form-card .form-grid > label:has(input[type="datetime-local"]) {
  align-items:flex-start;
}
.st-outside-forms .form-card .full-label {margin-top:18px}
.st-outside-forms .form-card .form-actions {clear:both;align-items:center;justify-content:flex-start}
/* Rows with a checkbox or file field are independent of label-grid rules. */
.st-outside-forms .form-card label:has(> input[type="checkbox"]) {display:flex;flex-direction:row;align-items:center;gap:10px}
.st-outside-forms .form-card label:has(> input[type="checkbox"]) > input {width:18px;height:18px;min-height:18px;flex:0 0 18px}
.st-outside-forms .form-card .file-drop {display:flex;flex-direction:column;gap:8px}
.st-outside-forms .form-card .file-drop > input[type="file"] {width:100%;max-width:100%}
/* Login opt-in must not inherit the full-width text-input style. */
.st-outside-forms .st-remember-choice {display:flex;align-items:flex-start;gap:10px;line-height:1.45;font-size:.76rem}
.st-outside-forms .st-remember-choice input[type="checkbox"] {flex:0 0 18px;width:18px;height:18px;min-height:18px;margin:2px 0 0;accent-color:#40c8ff}
/* Ensure long helper text does not change the position of the next column's control. */
@media(max-width:700px) {
 .st-outside-forms .form-card .form-grid {grid-template-columns:minmax(0,1fr);gap:18px}
 .st-outside-forms .form-card {min-width:0;padding:clamp(16px,4vw,30px)}
}

/* Account knowledge/download filter bars: avoid 6 fixed-width columns overflowing a tablet. */
.st-outside-forms .knowledge-library-filters {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));
  align-items:start;gap:14px 16px;min-width:0;
}
.st-outside-forms .knowledge-library-filters > label,
.st-outside-forms .knowledge-library-filters > div {min-width:0;max-width:100%}
.st-outside-forms .knowledge-library-filters :is(input,select) {min-width:0;max-width:100%;box-sizing:border-box}
.st-outside-forms .knowledge-library-filter-actions {align-self:end;display:flex;flex-wrap:wrap;gap:10px}
/* Stand-alone administrative dialogs; keep controls and descriptions in the same field. */
.st-outside-forms .knowledge-media-dialog-card label {min-width:0;align-content:start;align-self:start;grid-auto-rows:max-content}
.st-outside-forms .knowledge-media-dialog-card label .form-hint {margin:0;overflow-wrap:anywhere;text-align:left}
