/* AJUSTE v0.19.3: alinhamento único de seletores e ações em todo o sistema. */

/* Checkbox/radio e texto permanecem lado a lado, alinhados pela esquerda. */
label.mp-check,
.auth-channel label {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  width: fit-content;
  max-width: 100%;
  min-height: 32px;
  margin: 0;
  padding: 0;
  color: #344054;
  line-height: 1.35;
  text-align: left;
}

.op-permission-grid label {
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  text-align: left;
}

label.mp-check input[type="checkbox"],
label.mp-check input[type="radio"],
.auth-channel label > input[type="radio"],
.op-permission-grid label > input[type="checkbox"] {
  order: 0 !important;
  flex: 0 0 18px;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  accent-color: #059669;
}

label.mp-check > span {
  order: 1 !important;
  min-width: 0;
}

.op-permission-grid label > span {
  order: 1;
}

/* Sequências de opções viram um único grupo vertical e compacto. */
.mp-form-card > form:has(> label.mp-check + label.mp-check),
form.mp-form-card:has(> label.mp-check + label.mp-check) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: start;
  gap: 4px;
}

.mp-form-card > form:has(> label.mp-check + label.mp-check) > .mp-field,
form.mp-form-card:has(> label.mp-check + label.mp-check) > .mp-field {
  width: 100%;
}

.mp-options,
.op-check-list,
.op-permission-grid {
  align-items: start;
}

.mp-options label.mp-check,
.op-check-list label.mp-check,
.op-permission-grid label.mp-check {
  align-self: start;
}

/* Ações finais não encostam em campos, divisórias ou bordas do card. */
form.mp-form-card > :is(button, a).mp-primary,
form.mp-form-card > :is(button, a).mp-secondary,
form.mp-form-card > :is(button, a).mp-danger,
.mp-form-card > form > :is(button, a).mp-primary,
.mp-form-card > form > :is(button, a).mp-secondary,
.mp-form-card > form > :is(button, a).mp-danger,
form.mp-modal-card > :is(button, a).mp-primary,
form.mp-modal-card > :is(button, a).mp-secondary,
form.mp-modal-card > :is(button, a).mp-danger,
form > .mp-field + :is(button, a).mp-primary,
form > .mp-field + :is(button, a).mp-secondary,
form > .mp-field + :is(button, a).mp-danger {
  margin-top: 18px;
  margin-right: 8px;
  margin-bottom: 4px;
}

form.mp-modal-card > .mp-modal-close {
  margin: 0;
}

.mp-form-actions,
.mp-inline-actions,
.mp-banner-actions,
.auth-inline-actions,
.mp-wizard-actions {
  column-gap: 10px;
  row-gap: 10px;
}

.mp-form-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 18px;
  padding: 2px 0 4px;
}

form > :is(.mp-field, .mp-check, .mp-options, .mp-safe) + :is(.mp-inline-actions, .mp-form-actions) {
  margin-top: 18px;
  padding-top: 2px;
}

@media (max-width: 520px) {
  label.mp-check,
  .auth-channel label {
    width: 100%;
  }

  .mp-form-actions > :is(button, a),
  form.mp-form-card > :is(button, a).mp-primary,
  form.mp-form-card > :is(button, a).mp-secondary,
  form.mp-form-card > :is(button, a).mp-danger {
    width: 100%;
    margin-right: 0;
  }
}