/*
 * Minimal Prism.js styling - showing bare Prism formatting
 * All custom blue-box styling removed to see default Prism appearance
 */

/* Import Prism default theme */
@import url('https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism.min.css');

/* Code container needs relative positioning for absolute positioned copy buttons */
.code-container {
    position: relative;
}

/* Copy button with SVG to text animation */
.copy-button {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    width: 24px;
    height: 24px;
    background: none;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    z-index: 10;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(94, 94, 94)" viewBox="0 0 16 16"><path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/><path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    transition: all 0.3s ease-in-out;
    opacity: 0.6;
    overflow: hidden;
    font-size: 0.75rem;
    font-weight: 500;
    color: rgb(94, 94, 94);
    display: flex;
    align-items: center;
    justify-content: center;
}

.copy-button::after {
    content: 'COPY';
    position: absolute;
    opacity: 0;
    transform: translateX(100%);
    transition: all 0.3s ease-in-out;
    font-size: 0.75rem;
    font-weight: 500;
    color: rgb(94, 94, 94);
    white-space: nowrap;
}

.copy-button:hover {
    width: 40px;
    opacity: 1;
    background-image: none;
}

.copy-button:hover::after {
    opacity: 1;
    transform: translateX(0);
}

/* Copied state - success */
.copy-button.copied {
    width: 52px;
    opacity: 1;
    background-image: none;
}

.copy-button.copied::after {
    content: 'COPIED';
    opacity: 1;
    transform: translateX(0);
    color: #10b981;
}

/* Error state - failure */
.copy-button.error {
    width: 60px;
    opacity: 1;
    background-image: none;
    border: 1px solid #ef4444;
}

.copy-button.error::after {
    content: 'FAILED';
    opacity: 1;
    transform: translateX(0);
    color: #ef4444;
    font-weight: 600;
}

/* Remove all blue-box overrides - let Prism show its default styling */