/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */

/**
 * @file
 * Styling for the Filter module.
 */

/*
 * Media query breakpoints.
 * Processed by postcss/postcss-custom-media.
 */

/* Navigation related breakpoints */

/* Grid related breakpoints */

/* Grid shifts from 6 to 14 columns. */

/* Width of the entire grid maxes out. */

/**
 * Filter information under field.
 */

.text-full > .form-item {
  margin-block-end: 0;
}

.form-element--editor-format {
  vertical-align: top;
}

.filter-wrapper {
  margin-block: var(--sp1) var(--sp0-5);
}

.filter-wrapper .form-item {
  margin: 0;
}

.filter-help {
  float: right; /* LTR */
  padding-block: var(--sp0-5);
  font-size: var(--font-size-xxs);

  /**
   * Chromium and Webkit do not yet support flow relative logical properties,
   * such as float: inline-end. However, PostCSS Logical does not compile this
   * value, so we accommodate by not using these.
   *
   * @see https://caniuse.com/mdn-css_properties_clear_flow_relative_values
   * @see https://github.com/csstools/postcss-plugins/issues/632
   */
}

[dir="rtl"] .filter-help {
  float: left;
}

/**
 * Compose tips.
 *
 * Wraps filter tips on page '/filter/tips[/name]'.
 */

.compose-tips__item {
  margin-block: var(--sp1-5);
}

/**
 * Filter guidelines.
 */

.filter-guidelines__item {
  margin-block-start: var(--sp1);
  font-size: var(--font-size-s);
  line-height: var(--line-height-s);
}

.filter-guidelines p {
  margin-block: var(--sp0-25) 0;
}

/**
 * Filter tips.
 *
 * Long is used on '/filter/tips[/name]', short is used for the filter tips
 * below a text format input.
 */

.filter-tips--long {
  margin-block-end: var(--sp1-5);
}

.filter-tips__item,
.filter-tips--long p {
  margin-block: var(--sp0-75);
}

.filter-tips__item--short {
  margin-block: var(--sp0-25) 0;
}
