/* AI context: attach-file idle cue lives here so it is not hidden inside iOS/perf overrides. */
.background .background__stripe {
    animation-play-state: running !important;
}

@keyframes paperclipIdleWiggle {

    0%,
    1%,
    10%,
    100% {
        transform: translateY(0) rotate(0deg) scale(1);
    }

    2.2% {
        transform: translateY(-1px) rotate(-7deg) scale(1.035);
    }

    4.1% {
        transform: translateY(0) rotate(6deg) scale(1.025);
    }

    6.2% {
        transform: translateY(-0.5px) rotate(-4deg) scale(1.02);
    }

    8.1% {
        transform: translateY(0) rotate(2deg) scale(1.01);
    }
}

/* Start the empty-file paperclip wiggle 5s after the booking modal opens. */
#bookingModal.modal--active #bookingForm .file-attach:not(.file-attach--has-files) #attachFilesBtn .file-attach__icon {
    animation-name: paperclipIdleWiggle !important;
    animation-duration: 22s !important;
    animation-timing-function: ease-in-out !important;
    animation-delay: 5s !important;
    animation-play-state: running !important;
    animation-iteration-count: infinite !important;
    animation-fill-mode: none !important;
    display: inline-flex !important;
    transform-origin: 50% 50% !important;
    will-change: transform !important;
}

#bookingModal #attachFilesBtn .file-attach__icon-svg--paperclip,
#bookingModal.modal--active #bookingForm .file-attach.file-attach--has-files #attachFilesBtn .file-attach__icon,
#bookingModal:not(.modal--active) #bookingForm .file-attach #attachFilesBtn .file-attach__icon {
    animation: none !important;
    will-change: auto !important;
}

@media (prefers-reduced-motion: reduce) {
    #bookingModal.modal--active #bookingForm .file-attach:not(.file-attach--has-files) #attachFilesBtn .file-attach__icon {
        animation: none !important;
        will-change: auto !important;
    }
}
