/**
 * Zwantum Scroll To Top — Frontend Styles
 * (c) Zwantum — https://zwantum.com
 */

#zwantum-stt-btn {
    position: fixed;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 2px;
    padding: 0;
    margin: 0;
    cursor: pointer;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-decoration: none;
    line-height: 1;
    -webkit-tap-highlight-color: transparent;
    /* Defaults overridden by inline styles */
}

#zwantum-stt-btn svg {
    display: block;
    fill: currentColor;
    stroke: currentColor;
    pointer-events: none;
}

#zwantum-stt-btn .zwantum-stt-text {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    line-height: 1;
    pointer-events: none;
}

/* ===== Show state ===== */
#zwantum-stt-btn.zwantum-stt-visible {
    display: flex;
}

/* ===== Animations ===== */

/* Fade */
@keyframes zwantumFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes zwantumFadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}
#zwantum-stt-btn.zwantum-stt-anim-fade.zwantum-stt-show {
    animation: zwantumFadeIn var(--zwantum-anim-dur, 300ms) forwards;
}
#zwantum-stt-btn.zwantum-stt-anim-fade.zwantum-stt-hide {
    animation: zwantumFadeOut var(--zwantum-anim-dur, 300ms) forwards;
}

/* Slide Up */
@keyframes zwantumSlideUpIn {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes zwantumSlideUpOut {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(30px); }
}
#zwantum-stt-btn.zwantum-stt-anim-slide-up.zwantum-stt-show {
    animation: zwantumSlideUpIn var(--zwantum-anim-dur, 300ms) forwards;
}
#zwantum-stt-btn.zwantum-stt-anim-slide-up.zwantum-stt-hide {
    animation: zwantumSlideUpOut var(--zwantum-anim-dur, 300ms) forwards;
}

/* Slide Left */
@keyframes zwantumSlideLeftIn {
    from { opacity: 0; transform: translateX(30px); }
    to { opacity: 1; transform: translateX(0); }
}
@keyframes zwantumSlideLeftOut {
    from { opacity: 1; transform: translateX(0); }
    to { opacity: 0; transform: translateX(30px); }
}
#zwantum-stt-btn.zwantum-stt-anim-slide-left.zwantum-stt-show {
    animation: zwantumSlideLeftIn var(--zwantum-anim-dur, 300ms) forwards;
}
#zwantum-stt-btn.zwantum-stt-anim-slide-left.zwantum-stt-hide {
    animation: zwantumSlideLeftOut var(--zwantum-anim-dur, 300ms) forwards;
}

/* Slide Right */
@keyframes zwantumSlideRightIn {
    from { opacity: 0; transform: translateX(-30px); }
    to { opacity: 1; transform: translateX(0); }
}
@keyframes zwantumSlideRightOut {
    from { opacity: 1; transform: translateX(0); }
    to { opacity: 0; transform: translateX(-30px); }
}
#zwantum-stt-btn.zwantum-stt-anim-slide-right.zwantum-stt-show {
    animation: zwantumSlideRightIn var(--zwantum-anim-dur, 300ms) forwards;
}
#zwantum-stt-btn.zwantum-stt-anim-slide-right.zwantum-stt-hide {
    animation: zwantumSlideRightOut var(--zwantum-anim-dur, 300ms) forwards;
}

/* Zoom */
@keyframes zwantumZoomIn {
    from { opacity: 0; transform: scale(0.3); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes zwantumZoomOut {
    from { opacity: 1; transform: scale(1); }
    to { opacity: 0; transform: scale(0.3); }
}
#zwantum-stt-btn.zwantum-stt-anim-zoom.zwantum-stt-show {
    animation: zwantumZoomIn var(--zwantum-anim-dur, 300ms) forwards;
}
#zwantum-stt-btn.zwantum-stt-anim-zoom.zwantum-stt-hide {
    animation: zwantumZoomOut var(--zwantum-anim-dur, 300ms) forwards;
}

/* ===== Focus ring for accessibility ===== */
#zwantum-stt-btn:focus-visible {
    outline: 3px solid #005bb5;
    outline-offset: 2px;
}

/* ===== Print: hide ===== */
@media print {
    #zwantum-stt-btn {
        display: none !important;
    }
}