.Mymodal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1050; /* Bootstrap Modal Layer */
    display: flex;
    justify-content: center;
    align-items: center;
}

.Mycenter {
    text-align: center;
}
/* Custom class to increase spinner size */
.spinner-large {
    width: 4rem; /* Set width */
    height: 4rem; /* Set height */
    border-width: 0.4rem; /* Adjust the thickness of the spinner */
}

    .spinner-large.spinner-border {
        border-width: 0.5rem; /* For spinner-border (border thickness) */
    }

    .spinner-large.spinner-grow {
        width: 4rem; /* Grow spinner width */
        height: 4rem; /* Grow spinner height */
    }

.floating-button {
    position: fixed; /* Keeps the button fixed in place */
    bottom: 20px; /* Distance from the bottom of the viewport */
    right: 20px; /* Distance from the right of the viewport */
    z-index: 1050; /* Ensures it stays above other elements */
    width: 50px; /* Width of the button */
    height: 50px; /* Height of the button */
    background-color: white; /* Background color */
    border-radius: 10px; /* Rounded corners for the button */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
    display: flex; /* Center the content */
    justify-content: center; /* Horizontally center the icon */
    align-items: center; /* Vertically center the icon */
    cursor: pointer; /* Change cursor on hover */
    transition: transform 0.2s ease-in-out; /* Smooth hover animation */
}

    .floating-button:hover {
        transform: scale(1.1); /* Slightly enlarge the button on hover */
    }

    .floating-button i {
        font-size: 20px; /* Size of the icon */
        color:white; /* Icon color */
    }



/* Adjust calendar responsiveness for smaller screens */
@media (max-width: 576px) {
    .ajax__calendar {
        font-size: 14px; /* Smaller font for smaller screens */
    }
}