/* Default link styles */
a.custom-link {
    color: blue; /* Text color of the link */
    text-decoration: underline; /* Underline the link text */
    cursor: pointer; /* Change cursor to pointer when hovering over the link */
}

/* Hover state styles */
a.custom-link:hover {
    color: darkblue; /* Text color of the link when hovered */
}

/* Visited state styles */
a.custom-link:visited {
    color: purple; /* Text color of the link after it has been visited */
}

/* Active state styles */
a.custom-link:active {
    color: red; /* Text color of the link when it is being clicked */
}

/* General class for badge */
.badge {
    display: inline-block; /* Ensures the badge appears inline with other elements but allows for width and height */
    padding: 0.25rem 0.75rem; /* Adds padding around the text */
    font-size: 0.75rem; /* Sets the font size */
    font-weight: 500; /* Makes the text bold */
    line-height: 1; /* Sets the line height */
    text-align: center; /* Centers the text inside the badge */
    white-space: nowrap; /* Prevents the text from wrapping */
    vertical-align: baseline; /* Aligns with the surrounding text */
    border-radius: 0.25rem; /* Rounds the corners of the badge */
}

/* Specific class for warning badge */
.badge-warning {
    color: #856404;
    background-color: #fff3cd;
    border: 1px solid #ffeeba;
}

/* Specific class for danger badge */
.badge-danger {
    color: #721c24;
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
}

.ml-2 {
    margin-left: 0.5rem;
}