/**
 * @file
 * Manage styles for views exposed form.
 */

/**
 * Use flexbox and some margin resets to make the fields + actions go inline.
 */
.views-exposed-form--inline {
  display: flex;
  flex-wrap: wrap;
  margin-block: var(--form-spacing-s);
}

.views-exposed-form--preview.views-exposed-form--preview {
  margin-top: 0;
}

.views-exposed-form--inline .views-exposed-form__item {
  max-width: 100%;
  margin-block: var(--form-spacing-s) 0;
  margin-inline: 0 var(--form-spacing-xs);
}

.views-exposed-form--inline .form-item--no-label,
.views-exposed-form--inline .views-exposed-form__item.views-exposed-form__item.views-exposed-form__item--actions {
  margin-block: var(--form-spacing-s) 0;
  align-self: flex-end;
}

.views-exposed-form--inline .form-item--no-label,
.views-exposed-form--inline .views-exposed-form__item.views-exposed-form__item--actions {
  margin-top: calc(var(--form-label-line-height) + var(--form-label-input-spacing));
}

.views-exposed-form--inline .fr-input-group:not(:last-child),
.views-exposed-form--inline .fr-select-group:not(:last-child) {
  margin-bottom: 0;
}