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

.frozen-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 60vh;
  text-align: center;
  padding: 40px 20px;
}

.frozen-page-icon {
  font-size: 48px;
  margin-bottom: 24px;
}

.frozen-page-title {
  font-size: var(--tk-font-h3);
  font-weight: 600;
  color: $tx;
  margin-bottom: 12px;
}

.frozen-page-desc {
  font-size: var(--tk-font-body);
  color: $tx3;
  margin-bottom: 32px;
}

.frozen-page-btn {
  height: 44px;
  padding: 0 32px;
  border-radius: $r;
  background: var(--tk-pri);
  @include flex-center;

  &:active {
    opacity: var(--tk-touch-feedback-opacity);
  }
}

.frozen-page-btn-text {
  font-size: var(--tk-font-body);
  font-weight: 500;
  color: $white;
}