@import "./vars.pcss";

.palette {
  display: flex;
  flex-flow: row wrap;
  gap: var(--paletteGap);

  &__item {
    display: flex;
    flex-flow: column;
    gap: var(--paletteItemGap);
  }

  &__bg {
    width: var(--paletteItemSize);
    height: var(--paletteItemSize);
    border-radius: var(--paletteItemBorderRadius);
    background-color: var(--paletteItemBg);
  }

  &__label {
    font-size: var(--paletteLabelFontSize);

    b {
      display: block;
      font-weight: 700;
    }
  }
}