/*
 * Elementor default neutraliser.
 *
 * Elementor ships its own spacing rhythm (container gaps, widget bottom
 * margins, heading/paragraph margins). Our layouts set their own spacing, so
 * those defaults have to be zeroed or every gap is doubled.
 *
 * Everything here is scoped to `.rq-page` so templates that are NOT part of the
 * RigQuip design system keep Elementor's stock behaviour.
 */

.rq-page {
  /* Elementor derives container gaps and widget spacing from these. */
  --widgets-spacing: 0px;
  --widgets-spacing-row: 0px;
  --widgets-spacing-column: 0px;
}

/*
 * Containers: no inherited max-width, padding or gap — our classes own layout.
 *
 * The width cap is cleared through `--container-max-width` rather than a
 * `max-width: none` declaration, which would outrank `.rq-container` on
 * specificity and flatten our own container.
 */
.rq-page .e-con,
.rq-page .e-con-inner {
  /*
   * Elementor sizes containers at `--width: 100%`, which makes any container
   * used as a flex item claim a whole line and wrap. `auto` lets a container
   * size to its content in a row and still fill a block or grid track.
   */
  --width: auto;
  --container-max-width: none;
  --container-default-padding-block-start: 0px;
  --container-default-padding-block-end: 0px;
  --container-default-padding-inline-start: 0px;
  --container-default-padding-inline-end: 0px;
  --gap: 0px;
}

/* Widget wrappers must not introduce their own box. */
.rq-page .elementor-widget:not(:last-child),
.rq-page .elementor-element:not(:last-child) {
  margin-block-end: 0;
}

.rq-page .elementor-widget-container {
  margin: 0;
  padding: 0;
}

/*
 * Headings inherit everything from their widget wrapper.
 *
 * Elementor renders the heading tag inside a wrapper div and `_css_classes`
 * lands on that wrapper, so the tag has to inherit or the browser's own bold
 * and Elementor's `line-height: 1` would beat our type scale.
 */
.rq-page .elementor-heading-title {
  font: inherit;
  font-family: var(--rq-font-heading);
  color: inherit;
  letter-spacing: inherit;
  margin: 0;
}

.rq-page .elementor-widget-text-editor p {
  margin: 0;
}

/*
 * Widget content sits inside an extra `.elementor-widget-container` div, which
 * would become the only flex item of any row we style on the wrapper.
 * `display: contents` drops that div out of the box tree so the real content
 * (chips, meta spans, links) participates in the row directly.
 */
.rq-page .rq-contents > .elementor-widget-container {
  display: contents;
}

.rq-page .elementor-widget-text-editor p + p {
  margin-block-start: 1em;
}

/* Images: fill their slot, never stretch beyond it. */
.rq-page .elementor-widget-image,
.rq-page .elementor-widget-image .elementor-widget-container,
.rq-page .elementor-widget-image figure,
.rq-page .elementor-widget-image a {
  display: block;
  line-height: 0;
}

.rq-page .elementor-widget-image img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 0;
}

/* Buttons: strip Elementor's skin so the RigQuip button ladder can define it. */
.rq-page .elementor-button {
  --e-button-padding-block-start: 0px;
  --e-button-padding-block-end: 0px;
  --e-button-padding-inline-start: 0px;
  --e-button-padding-inline-end: 0px;
  background-image: none;
  border: 0;
  box-shadow: none;
  fill: currentColor;
}

.rq-page .elementor-button-content-wrapper {
  gap: 0.5rem;
}

/* Dividers are hairlines in this system, never Elementor's default weight. */
.rq-page .elementor-widget-divider {
  --divider-border-width: 1px;
  --divider-color: var(--rq-border);
  --divider-pattern-height: 1px;
}

/* Icon widgets carry their own sizing through .rq-icon-chip. */
.rq-page .elementor-widget-icon .elementor-icon {
  font-size: inherit;
  padding: 0;
}