/*
 * Send Listy Core 0.718 — Active List Optional Fields Icon Alignment
 * Parent: Core 0.717 — Group Canonical Axis Root Fix
 *
 * Scope: Add/Edit List > rendered list-level optional fields only.
 * Presentation only. No field state, save/read-back, defaults, DB, item editor,
 * group logic, or global form CSS changes.
 */

/* Every active list-level field uses one label rail that begins exactly at the
   same inline edge as its input/select/textarea box below. */
.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > .sl-active-list-field-label {
  display:grid !important;
  grid-template-columns:24px minmax(0,1fr) !important;
  align-items:center !important;
  column-gap:8px !important;
  width:100% !important;
  min-height:24px !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  color:inherit !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1.25 !important;
  text-align:start !important;
}

.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > .sl-active-list-field-label
.sl-active-list-field-icon {
  display:grid !important;
  place-items:center !important;
  width:24px !important;
  height:24px !important;
  min-width:24px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  font-style:normal !important;
  font-size:16px !important;
  font-weight:700 !important;
  line-height:1 !important;
  text-align:center !important;
  justify-self:start !important;
}

.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > .sl-active-list-field-label
.sl-active-list-field-icon-text {
  color:#4f9f69 !important;
  font-weight:900 !important;
}

.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > .sl-active-list-field-label
.sl-active-list-field-text {
  display:block !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  text-align:start !important;
}

/* Keep the field box itself on exactly the same outer rail as the icon above. */
.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > input,
.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > select,
.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > textarea {
  margin-inline:0 !important;
  box-sizing:border-box !important;
}

/* Helper copy belongs to the field rail, not the icon/text sub-grid. */
.send-list-app .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > small {
  margin-inline:0 !important;
  text-align:start !important;
}

.send-list-app.sl-dark-mode .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > .sl-active-list-field-label {
  color:#ffffff !important;
}

.send-list-app.sl-dark-mode .sl-modal.is-create-list-modal
.sl-form-grid.sl-optional-fields > .sl-field > .sl-active-list-field-label
.sl-active-list-field-icon-text {
  color:#79df97 !important;
}

@media(max-width:767px){
  .send-list-app .sl-modal.is-create-list-modal
  .sl-form-grid.sl-optional-fields > .sl-field > .sl-active-list-field-label {
    grid-template-columns:24px minmax(0,1fr) !important;
    column-gap:8px !important;
  }
}
