/* Scroll to Top Button Styles */
/* resources/css/app.css or resources/sass/app.scss */
     html, body {
    background-color: #0dcaf0; /* A very light grey */
    /* You might want to remove default margins if present from other styles */
    /* margin: 0; */
    /* padding: 0; */
}


/* Add your existing CSS below this */
.scroll-to-top-btn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed position */
    bottom: 30px; /* Distance from bottom */
    right: 30px; /* Distance from right */
    z-index: 99; /* Higher z-index to ensure it's on top */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: #007bff; /* Button background color (Bootstrap primary blue) */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    padding: 15px 20px; /* Some padding */
    border-radius: 50%; /* Make it circular */
    font-size: 18px; /* Increase font size for the arrow */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Subtle shadow */
    transition: background-color 0.3s, opacity 0.3s; /* Smooth transitions */
    opacity: 0.8; /* Slightly transparent when not hovered */
}

.scroll-to-top-btn:hover {
    background-color: #0056b3; /* Darker blue on hover */
    opacity: 1; /* Fully opaque on hover */
}