.or-copy-field {
    min-width: 0;
    min-height: 52px;
    padding: 0 1rem;
    border: 1px solid var(--or-border);
    background: var(--or-surface);
    color: var(--or-text);
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-family: var(--or-font-mono);
    font-size: 0.78rem;
    transition: background-color var(--or-theme-transition), border-color var(--or-theme-transition), color var(--or-theme-transition);
}

.or-copy-prefix {
    flex: 0 0 auto;
    color: var(--or-text-muted);
}

.or-copy-field code {
    min-width: 0;
    flex: 1;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.or-copy-button {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--or-text-muted);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: color var(--or-theme-transition);
}

.or-copy-button:hover,
.or-copy-button:focus-visible,
.or-copy-button[data-copied="true"] {
    color: var(--or-text);
}

.or-copy-button:focus-visible {
    outline: 1px solid currentColor;
    outline-offset: 2px;
}

.or-copy-icon {
    width: 16px;
    height: 16px;
    display: block;
    background: currentColor;
    -webkit-mask: url("/assets/copy.112f53944033.svg") center / contain no-repeat;
    mask: url("/assets/copy.112f53944033.svg") center / contain no-repeat;
}