.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;

  width: 100%;
  max-width: 500px;
  min-height: 212px;
  padding: 40px 20px;
  margin: 0 auto;

  // Minimal size variant
  &.minimal {
    gap: map.get($spacing-scale, 'md');
    min-height: auto;
    padding: map.get($spacing-scale, 'lg') map.get($spacing-scale, 'md');

    .icon {
      height: 40px;
      margin-bottom: 0;
    }

    .title {
      @include body-small-bold;
    }

    .subtitle {
      @include metadata-medium;
    }
  }
}

// Icon container
.icon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 82px;
  margin-bottom: map.get($spacing-scale, 'xs');

  svg,
  img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }
}

// Content container
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}

.title {
  @include heading-4;
  color: var(--color-text-primary);
  margin: 0;
}

.subtitle {
  @include body-regular;
  color: var(--color-text-secondary);
  max-width: 400px;
  margin: 0;
}

// Actions container
.actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: map.get($spacing-scale, 'md');
  margin-top: map.get($spacing-scale, 'xs');
}