/* ==========================================================================
   Mail setup (AI-1825): the mail wizard at /settings/communication/mail —
   the scenario choices as one quiet list, the own-domain steps, the DNS
   records table and the tinted wells for addresses and provider steps.
   ========================================================================== */

.mail-setup__muted {
    color: var(--ui-text-2);
}

.mail-setup__address {
    margin: 0;
    word-break: break-all;
}

.mail-setup__steps-text {
    white-space: pre-line;
}

/* A button next to a field in the same grid row lines up with the input,
   not with the field's label. */
.mail-setup__action {
    display: flex;
    align-items: flex-end;
}

/* A tinted block: the gateway address to copy, the provider's DNS steps. */
.mail-setup-well {
    padding: 12px 16px;
    border-radius: var(--ui-radius);
    background: var(--ui-bg-sunken);
}

/* --- Scenario choices ---------------------------------------------------- */

.mail-setup-choices {
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius);
}

.mail-setup-choice {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 14px 12px 14px 16px;
    border: 0;
    background: transparent;
    color: var(--ui-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color 100ms var(--ui-ease);
}

.mail-setup-choice + .mail-setup-choice {
    border-top: 1px solid var(--ui-divider);
}

.mail-setup-choice:hover {
    background: var(--ui-bg-hover);
}

.mail-setup-choice:focus-visible {
    outline: none;
    box-shadow: inset 0 0 0 2px var(--ui-accent);
}

.mail-setup-choice__text {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
}

.mail-setup-choice__title {
    font-size: 0.9375rem;
    font-weight: 600;
}

.mail-setup-choice__hint {
    color: var(--ui-text-2);
    font-size: 0.8125rem;
}

.mail-setup-choice__chevron {
    flex: none;
    color: var(--ui-text-3);
}

/* --- Own-domain steps ---------------------------------------------------- */

.mail-setup-steps {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mail-setup-steps__item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.875rem;
}

.mail-setup-steps__number {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: 1px solid var(--ui-accent);
    border-radius: var(--ui-radius-pill);
    color: var(--ui-accent);
    font-size: 0.75rem;
    font-weight: 600;
}

.mail-setup-steps__item--done .mail-setup-steps__text {
    color: var(--ui-text-2);
}

/* --- DNS records --------------------------------------------------------- */

.mail-setup-records {
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius);
}

.mail-setup-records td {
    vertical-align: top;
}

.mail-setup-records code {
    word-break: break-all;
}

.mail-setup-records__name {
    min-width: 180px;
}

.mail-setup-records__value {
    max-width: 320px;
    word-break: break-all;
}

.mail-setup-records__copy {
    display: flex;
    align-items: center;
    gap: 4px;
}

.mail-setup-records__observed {
    margin-top: 4px;
}

.mail-setup-records__status {
    white-space: nowrap;
}