@layer ed-utilities {
  /* Apply Flexbox with 0 specificity to ensure a gap util produces a visible change */
  :where(
    .ed-gap-0,
    .ed-gap-1,
    .ed-gap-2,
    .ed-gap-3,
    .ed-gap-4,
    .ed-gap-5,
    .ed-gap-6,
    .ed-gap-7,
    .ed-gap-8,
    .ed-gap-9,
    .ed-gap-10,
    .ed-gap-11,
    .ed-gap-12,
    .ed-gap-13,
    .ed-gap-14,
    .ed-gap-15,
    .ed-gap-16
  ) {
    display: flex;
  }

  .ed-gap-0 {
    gap: 0;
  }
  .ed-gap-1 {
    gap: var(--ed-space-1);
  }
  .ed-gap-2 {
    gap: var(--ed-space-2);
  }
  .ed-gap-3 {
    gap: var(--ed-space-3);
  }
  .ed-gap-4 {
    gap: var(--ed-space-4);
  }
  .ed-gap-5 {
    gap: var(--ed-space-5);
  }
  .ed-gap-6 {
    gap: var(--ed-space-6);
  }
  .ed-gap-7 {
    gap: var(--ed-space-7);
  }
  .ed-gap-8 {
    gap: var(--ed-space-8);
  }
  .ed-gap-9 {
    gap: var(--ed-space-9);
  }
  .ed-gap-10 {
    gap: var(--ed-space-10);
  }
  .ed-gap-11 {
    gap: var(--ed-space-11);
  }
  .ed-gap-12 {
    gap: var(--ed-space-12);
  }
  .ed-gap-13 {
    gap: var(--ed-space-13);
  }
  .ed-gap-14 {
    gap: var(--ed-space-14);
  }
  .ed-gap-15 {
    gap: var(--ed-space-15);
  }
  .ed-gap-16 {
    gap: var(--ed-space-16);
  }
}
