/* SVG -------------------------------------------------------------- */
.elementor-widget-byko-scroll-svg {
    pointer-events: none;
}
body.elementor-editor-active .elementor-widget-byko-scroll-svg {
    pointer-events: auto;
}
.byko-scroll-svg {
    display: block;
    opacity: 0;
    transition: opacity 300ms ease;
    width: 100%;
    max-width: none;
    line-height: 0;
    pointer-events: none;
    overflow: hidden;
}
.byko-scroll-svg.byko-scroll-svg--ready {
    opacity: 1;
}
.byko-scroll-svg > svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
}
.byko-scroll-svg--stretch > svg {
    height: 100%;
}
.byko-scroll-svg__notice {
    padding: 12px;
    background: #fff8df;
    color: #3d3100;
    line-height: 1.5;
    font-size: 13px;
}

/* Texto escrito con scroll ---------------------------------------- */
/* El texto solo se oculta después de que JS lo haya preparado. Sin JS queda visible. */
.byko-write--ready .byko-write-word {
    white-space: nowrap;
}
.byko-write--ready .byko-write-char {
    opacity: 0;
    transition: opacity 70ms linear;
}
.byko-write--ready .byko-write-char.is-visible {
    opacity: 1;
}

/* Cursor opcional. No ocupa espacio y sigue al último carácter visible. */
.byko-write--cursor .byko-write-char.is-current {
    position: relative;
}
.byko-write--cursor .byko-write-char.is-current::after {
    content: '';
    position: absolute;
    top: 0.08em;
    right: -0.08em;
    width: 0.08em;
    height: 0.9em;
    background: currentColor;
    animation: byko-write-cursor-blink 0.8s steps(1, end) infinite;
    pointer-events: none;
}
.byko-write--cursor.byko-write--cursor-at-start .byko-write-char.is-current::after {
    right: auto;
    left: 0;
}

@keyframes byko-write-cursor-blink {
    0%, 45% { opacity: 1; }
    46%, 100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .byko-write--ready .byko-write-char {
        transition: none;
    }
    .byko-write--cursor .byko-write-char.is-current::after {
        display: none;
    }
}
