/*html {
    font-size: 16px;
    font-family: Arial, sans-serif;*/ /* Change the font family here */
/*}*/

.chart-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40vh;
    width: 80vw;
    margin: auto;
}

/* Adjusting for smaller screens */
@media screen and (max-width: 600px) {
    .chart-container {
        width: 95vw; /* slightly smaller to fit in smaller screens */
        height: 30vh;
    }
}

/* You can add more media queries for different breakpoints */


.welcome-message {
    font-weight: 400; /* Change as desired */
    color: #333; /* Change to your preferred color */
    text-transform: uppercase; /* Makes text uppercase */
    font-size: 18px; /* Adjust the font size as needed */
    padding: 5px 10px; /* Adds some space around the text for better visibility */
}

.dropdown-menu {
    padding: 10px;
    min-width: 20rem; /* Adjust width as needed */
}

.form-check {
    cursor: pointer;
}


.btn-google {
    color: white;
    background-color: #db4437;
    border: none;
    padding: 8px 12px;
}

    .btn-google:hover {
        background-color: #c1351d;
    }

    .btn-google i {
        margin-right: 5px;
    }

.sadhana-heading {
    font-weight: bold;
    color: #007bff; /* Example color, adjust as needed */
}


.username {
    font-weight: 700; /* Making username bold */
    color: #007BFF; /* Making username a different color, change as desired */
    /* border-bottom: 2px solid #007BFF; Removed the underline */
    padding-bottom: 2px; /* Space between text and underline (you can remove this too if you want) */
}

th:nth-child(1), td:nth-child(1) { /* Date column */
    width: 10%;
    min-width: 100px;
}

th:nth-child(9), td:nth-child(9) { /* Edit column */
    width: 10%;
    min-width: 80px;
}

/*body {
    margin-bottom: 60px;*/
/*background-image: url('../images/background-image.jpg');*/
/*background-color: #f6f6f6;
    background: repeating-linear-gradient( 45deg, #ffffff, #ffffff 10px, #f6f6f6 10px, #f6f6f6 20px );
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    color: #333;*/ /* Dark color for the text */
/*font-family: 'Lato', sans-serif;
}*/


.specific-text {
    font-size: 1.2em; /* Adjust size as needed */
    font-weight: 700; /* Making the font bolder */
    color: #333; /* Adjust color as needed */
}

.login-container {
    background-color: rgba(255, 255, 255, 0.5); /* Even lower opacity */
    border: none; /* Removing the border */
    box-shadow: none; /* Removing the shadow */
}

@media (max-width: 767px) {
    .form-floating {
        padding: 0.5rem;
    }

        .form-floating label {
            white-space: normal; /* Allow labels to wrap */
            text-align: left; /* Align text to the left for better readability */
        }

        .form-floating label {
            margin-top: -8px; /* Adjust the margin-top as needed */
            font-size: 14px; /* Optional: Adjust the font size for better visibility on mobile */
            /* Additional styling here if needed */
        }

        .form-floating .form-control {
            height: auto; /* Adjust the height of the input field as required */
            padding: 10px; /* Adjust padding to ensure text doesn't touch the edges */
            /* Additional styling for the input field if needed */
        }

        .form-floating input,
        .form-floating select {
            font-size: 1rem;
        }

        .form-floating label {
            font-size: 0.9rem;
        }

    .container {
        padding: 20px; /* Reduced padding on smaller screens */
    }

    .btn {
        padding: 10px 15px;
        font-size: 1rem;
    }
}


/*.container {
    overflow: visible;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 50px;*/ /* Increased from 30px to 50px */
/*border-radius: 15px;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
    border: 3px solid rgba(0, 0, 0, 0.1);*/ /* Increased border thickness from 1px to 3px */
/*}*/


.navbar, .footer {
    z-index: 1001;
    background-color: rgba(255, 255, 255, 0.9); /* Matching the container styling */
}

.center-right-image {
    position: fixed;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    z-index: 1000;
}

/* Adding some styling to navbar links for a more engaging look */
.nav-item a {
    color: #495057;
    transition: color 0.3s ease-in-out;
}

    .nav-item a:hover {
        color: #000;
        text-decoration: none;
    }

/* Updating the footer text color to match the body text */
.footer {
    color: #333;
}

select.form-control {
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

    select.form-control:hover {
        border-color: #80bdff;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }

    select.form-control:focus {
        border-color: #80bdff;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
        outline: none;
    }


.missing-dates-list {
    border: 2px solid #f1f1f1;
    border-radius: 5px;
    padding: 15px;
    max-width: 250px;
    list-style-type: none; /* This will remove the default bullet points */
}

    .missing-dates-list li {
        font-size: 16px;
        padding: 5px 0;
        border-bottom: 1px solid #e0e0e0;
        color: #333;
    }

        .missing-dates-list li:last-child {
            border-bottom: none; /* Removing the border for the last item to keep it clean */
        }


.record-badge {
    display: inline-block;
    background-color: #007bff; /* You can adjust this color if needed */
    color: white;
    padding: 5px 10px;
    border-radius: 12px;
    font-size: 14px;
    text-decoration: none;
    transition: background-color 0.2s; /* Smoothens the hover effect */
}

    .record-badge:hover {
        background-color: #0056b3; /* Darker shade for hover effect */
        text-decoration: none; /* Ensure the link doesn't get underlined on hover */
        color: white; /* Keeps text color consistent on hover */
    }
