@use "../base/mixins";

.info-panel {
  display: flex;
  align-items: center;
  background: var(--uc-warning-warning);
  border-radius: 0.5rem;
  padding: 0.375rem 0.625rem;
  gap: 0.625rem;

  &__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--uc-background);
    font-size: 0.9rem;
    width: 1.5rem;
    height: 1.5rem;
  }

  &__text {
    @include mixins.secondary-body-extrasmall;
    color: var(--uc-background);
  }

  &--warning {
    background: var(--uc-error-error-60);
  }
}