/**
 * Global Base Styles for Single Tool Page
 */

html,
body {
    overflow-x: clip;
    /* Clip prevents horizontal scroll without breaking position: sticky */
    max-width: 100vw;
}

.single-tool-page {
    padding-bottom: var(--space-16);
    overflow-x: clip;
    max-width: 100%;
    width: 100%;
}

/* Prevent ANY child from causing overflow */
.single-tool-page *,
.single-tool-page *::before,
.single-tool-page *::after {
    box-sizing: border-box !important;
    max-width: 100%;
}

/* SVGs specifically - these were causing overflow */
.single-tool-page svg {
    flex-shrink: 0;
    width: auto;
    max-width: 100%;
}

/* Container Fix */
.bfai-main-container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--container-padding);
    overflow: visible;
    width: 100%;
}

/* ============================================
   ANIMATIONS & UTILITIES
   ============================================ */

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.icon-spin {
    animation: spin 1s linear infinite;
}

@keyframes copySuccess {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}