/* Back to Top Button - Always on the Right */
/* This ensures the back to top button is always positioned on the right side */

#btn-back-to-top {
    position: fixed !important;
    right: 20px !important;
    left: auto !important;
    bottom: 30px !important;
    width: 56px !important;
    height: 56px !important;
    background: #0d6efd !important;
    color: white !important;
    border: none !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    font-size: 20px !important;
    box-shadow: 0 4px 12px rgba(13, 110, 253, 0.4) !important;
    z-index: 1000 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

#btn-back-to-top:hover {
    background: #0b5ed7 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(13, 110, 253, 0.5) !important;
}

#btn-back-to-top:active {
    transform: translateY(-1px) !important;
}

/* Mobile adjustments - Still on the right */
@media (max-width: 768px) {
    #btn-back-to-top {
        right: 16px !important;
        left: auto !important;
        bottom: calc(12px + env(safe-area-inset-bottom) + 100px) !important;
        width: 50px !important;
        height: 50px !important;
        font-size: 18px !important;
    }
}

/* Ensure fab-stack is always on the right */
.fab-stack {
    right: var(--fab-right) !important;
    left: auto !important;
    align-items: flex-end !important;
}

@media (max-width: 768px) {
    .fab-stack {
        right: var(--fab-right) !important;
        left: auto !important;
        align-items: flex-end !important;
    }
}

/* Override any conflicting styles */
.floating-btn-back-to-top {
    position: fixed !important;
    right: 20px !important;
    left: auto !important;
}

@media (max-width: 768px) {
    .floating-btn-back-to-top {
        right: 16px !important;
        left: auto !important;
    }
}

/* Pulse animation for attention */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

#btn-back-to-top:hover {
    animation: pulse 1.5s infinite;
}

/* Force button to be on the right - Override all conflicting styles */
body #btn-back-to-top,
html #btn-back-to-top,
.fab-stack #btn-back-to-top {
    right: 20px !important;
    left: auto !important;
}

@media (max-width: 768px) {
    body #btn-back-to-top,
    html #btn-back-to-top,
    .fab-stack #btn-back-to-top {
        right: 16px !important;
        left: auto !important;
    }
}