/* Copyright 2024, 2025 New Vector Ltd.
 * Copyright 2023, 2024 The Matrix.org Foundation C.I.C.
 *
 * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
 * Please see LICENSE files in the repository root for full details.
 */

.user-email {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--cpd-space-2x);
}

.user-email-line {
  display: flex;
  align-self: stretch;
  gap: var(--cpd-space-2x);
}

.user-email-delete-icon {
  color: var(--cpd-color-icon-critical-primary);
}

button[disabled] .user-email-delete-icon {
  color: var(--cpd-color-icon-disabled);
}

.user-email-field {
  flex: 1;
}

.user-email-unverified {
  color: var(--cpd-color-text-critical-primary);
}

.email-modal-box {
  display: flex;
  align-items: center;
  gap: var(--cpd-space-4x);
  border-radius: var(--cpd-space-4x);
  border: 1px solid var(--cpd-color-gray-400);
  padding: var(--cpd-space-3x);
  font: var(--cpd-font-body-md-semibold);

  & > svg {
    color: var(--cpd-color-icon-secondary);
    background-color: var(--cpd-color-bg-subtle-secondary);
    padding: var(--cpd-space-2x);
    border-radius: var(--cpd-space-2x);
    inline-size: var(--cpd-space-10x);
    block-size: var(--cpd-space-10x);
  }
}

.link {
  display: inline-block;
  text-decoration: underline;
  color: var(--cpd-color-text-primary);
  font-weight: var(--cpd-font-weight-medium);
  border-radius: var(--cpd-radius-pill-effect);
  padding-inline: 0.25rem;
}

.link:hover {
  background: var(--cpd-color-gray-300);
}

.link:active {
  background: var(--cpd-color-text-primary);
  color: var(--cpd-color-text-on-solid-primary);
}
