@use '../../../shared/styles/settings-shared' as settings;

.email-settings-container {
  @include settings.settings-page-container;
}

@include settings.settings-page-header;
@include settings.settings-section-divider;

.settings-title {
  @include settings.settings-page-title;
  margin-bottom: 0.75rem;
}

.settings-description {
  @include settings.settings-page-description;
}

.access-denied-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.5rem;
  border-radius: settings.$settings-card-border-radius;
  background: color-mix(in srgb, var(--ground-background) 85%, var(--p-red-600) 15%);
  border: 1px solid var(--p-content-border-color);
  border-left: 3px solid var(--p-red-500);
  max-width: 500px;

  > .pi {
    font-size: 1.5rem;
    flex-shrink: 0;
    color: var(--p-red-400);
  }

  .access-denied-content {
    h3 {
      margin: 0 0 0.5rem 0;
      font-size: 1rem;
      font-weight: settings.$settings-section-title-weight;
      color: var(--p-red-300);
    }

    p {
      margin: 0;
      font-size: settings.$settings-section-description-size;
      line-height: 1.5;
      color: var(--p-text-muted-color);
    }
  }
}
