/*--------- Form validation -------------*/
.is-invalid {
    border-color: #dc3545;
    background-color: #fdd;
}
/*--------- Modal POPUP Links -------------*/
.scrollable-body-part-list {
    max-height: 200px;
    /* Set your scroll height */
    overflow-y: auto;
    /* Enable vertical scroll */
    padding: 10px;
    border: 1px solid #ccc;
    background: #f9f9f9;
}

.body-part-link {
    display: block;
    padding: 6px 10px;
    text-decoration: none;
    color: #007bff;
    border-bottom: 1px solid #eee;
}

.body-part-link:hover {
    background-color: #e9ecef;
    color: #0056b3;
    text-decoration: underline;
}

/*--------- Step 3 Disease details -------------*/

#selected-disease-detail,
#disease-list,
#step3-content {
    font-family: inherit;
    font-size: inherit;
}

#selected-disease-detail * {
    font-family: inherit !important;
    font-size: 16px !important;
    /* Or inherit */
    color: inherit !important;
}

.disease-item:hover {
    background-color: #f8f9fa;
    border-color: #007bff;
}

/*--------- Loader before step 2 page loading -------------*/
.loader-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.loader-spinner {
    width: 60px;
    height: 60px;
    border: 6px solid #ddd;
    border-top: 6px solid #007bff;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}