@use '../../compiled/tokens/scss/size';
@use '../../mixins/spacing';

:root {
  --rhythm: #{size.$rhythm-default};
}

.o-rhythm {
  @include spacing.vertical-rhythm(size.$rhythm-default);
}

/// General spacing modifiers
///
/// The `--rhythm` property change is applied to children so it won't impact
/// any rhythm acting on the parent element.

.o-rhythm--compact > * {
  --rhythm: #{size.$rhythm-compact};
}

.o-rhythm--condensed > * {
  --rhythm: #{size.$rhythm-condensed};
}

.o-rhythm--generous > * {
  --rhythm: #{size.$rhythm-generous};
}

.o-rhythm--lavish > * {
  @include spacing.fluid-vertical-rhythm;
}

.o-rhythm--default > * {
  --rhythm: #{size.$rhythm-default};
}

// Heading modifiers

.o-rhythm--generous-headings > * {
  --rhythm-headings: #{size.$rhythm-generous};
}

.o-rhythm--lavish-headings > * {
  @include spacing.fluid-vertical-rhythm($headings: true);
}