.cobalt-contained-icon {
  --containerSize: 48px;

  width: var(--containerSize);
  height: var(--containerSize);

  display: flex;

  justify-content: center;
  align-items: center;

  flex-shrink: 0;

  @apply c-rounded-lg;

  .cobalt-Icon {
    @apply c-fill-onSurface;

    width: 24px;
    height: 24px;
  }
}

// Color modifiers (.cobalt-contained-icon--color*) are generated from
// src/components/ContainedIcon/colors.json — see
// scripts/buildContainedIconColors.mjs. Do not add &--color* rules here;
// edit colors.json and run `pnpm build:containedIconColors` instead.
@import "./colorModifiers.generated";
