@import '../../styles/variables.scss';

.error-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--tk-gap-2xl) var(--tk-gap-xl);
}

.error-state-icon {
  font-size: var(--tk-font-display);
  margin-bottom: var(--tk-gap-lg);
}

.error-state-text {
  font-size: var(--tk-font-body-lg);
  color: $tx2;
  margin-bottom: var(--tk-gap-xl);
  text-align: center;
}

.error-state-retry {
  background: var(--tk-pri);
  border-radius: 40px;
  padding: var(--tk-gap-md) var(--tk-gap-2xl);
}

.error-state-retry-text {
  font-size: var(--tk-font-body-lg);
  color: $white;
}