@use "@sass-palette/hope-config";

@mixin wrapper($pad: hope-config.$pad, $mobile: hope-config.$mobile) {
  max-width: var(--content-width);
  margin: 0 auto;
  padding: 2rem 2.5rem;

  @media (max-width: $pad) {
    padding: 1.5rem;
  }

  @media (max-width: $mobile) {
    padding: 1rem 1.5rem;
  }

  @media print {
    max-width: unset;
  }
}

@mixin horizontal-wrapper($pad: hope-config.$pad) {
  max-width: var(--content-width);
  margin-inline: auto;
  padding-inline: 2.5rem;

  @media (max-width: $pad) {
    padding-inline: 1.5rem;
  }

  @media print {
    max-width: unset;
  }
}