@use '../base/variable' as v;
@use '../abstract';

:root {
  --gap: #{v.$gap-sm};

  @include abstract.media-bp-up('ex') {
    --gap: #{v.$gap-ex};
  }
}

.cds-grid {
  display: grid;
  grid-template-columns: repeat(var(--columns, v.$grid-columns), 1fr);
  grid-template-rows: repeat(var(--rows, 1), 1fr);
  -moz-column-gap: var(--gap);
  column-gap: var(--gap);

  @include abstract.make-css-grid();
}