/* Scroll to Top Button - Glassy Right Bottom Position Override */

.scroll-to-top-btn {
    /* Reposition to right bottom corner */
    bottom: 2rem !important;
    right: 2rem !important;
    left: auto !important;

    /* Increase size slightly */
    width: 56px !important;
    height: 56px !important;

    /* Glassy Transparent Effect */
    background: rgba(255, 255, 255, 0.1) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;

    /* Blue arrow color */
    color: #2d2e6e !important;

    /* Border for glass effect */
    border: 1.5px solid rgba(255, 255, 255, 0.3) !important;

    /* Enhanced shadow for depth */
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;

    /* Ensure it's below WhatsApp button */
    z-index: 9998 !important;

    /* Slightly larger icon */
    font-size: 20px !important;

    /* Progress Indicator with ORANGE border */
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.15)),
        conic-gradient(#f26a36 var(--scroll-progress, 0deg), transparent 0deg) !important;
}

.scroll-to-top-btn:hover {
    transform: translateY(-3px) scale(1.08) !important;
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
    background: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
}

.scroll-to-top-btn:active {
    transform: translateY(-1px) scale(1.02) !important;
}

.scroll-to-top-btn.show {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

.scroll-to-top-btn:focus {
    outline: none !important;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        0 0 0 3px rgba(242, 106, 54, 0.3) !important;
}

/* Hide on Mobile and Tablet - Show only on Desktop (1025px and above) */
@media (max-width: 1024px) {
    .scroll-to-top-btn {
        display: none !important;
    }
}

/* Tooltip positioning update for right side */
.scroll-to-top-text {
    right: 66px !important;
    left: auto !important;
}