.copy-btn {
    position: relative;
}

/* Not svg-specific: chat-cta.js pairs a type icon (SVG or FontAwesome <i>) with
   ICON_CHECK, so these target "first/last direct child" regardless of tag. */
.copy-btn > * {
    transition: none;
}

.copy-btn > :last-child {
    visibility: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.copy-btn.copied > :first-child {
    visibility: hidden;
}

.copy-btn.copied > :last-child {
    visibility: visible;
}

#copyDocBtn {
    background: none;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    cursor: pointer;
    padding: 5px 7px;
    color: #6b7280;
    line-height: 0;
    transition: background 0.15s, color 0.15s;
}

#copyDocBtn:hover {
    background: #f8f9fa;
    color: #212529;
}