@import url("@arc-ui/tokens-arc/dist/custom-media.css");

.ruleContainer {
  flex: 0 1 auto;
  padding: 24px;
}

/* stylelint-disable-next-line selector-pseudo-class-no-unknown */
.ruleContainer :global(.arc-Rule) {
  margin: 0;
}

@media (--arc-custom-media-min-width-m-px) {
  .row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(
        0,
        1fr
      );
  }
}

@media (--arc-custom-media-min-width-l-px) {
  .ruleContainer {
    padding: 12px 48px;
  }

  .row {
    padding: 0 24px;
  }
}