.tag-template {
    padding: 3px 12px !important; /* Padding inside the tag */
    border-radius: 25px !important; /* Rounded corners */
    text-align: left !important; /* Center text */
    text-decoration: none !important; /* Remove underline */
    display: inline-block !important; /* Ensure it behaves like a tag */
    margin-right: 6px; /* Add space to the right of the tag */
    margin-bottom: 6px; /* Add space to the bottom of the tag */
    margin-top: 10px;
    font-size: 14px; /* Smaller text size */
    transition: background-color 0.3s ease !important; /* Smooth transition on hover */
    font-weight: bold !important;
}

.red-tag {
    background-color: #E51E26 !important;
    color: #ffffff !important;
}

.red-tag:hover {
    background-color: rgba(201, 49, 44, 0.836) !important;
}

.dark-red-tag {
    background-color: #7F131B !important;
    color: #ffffff !important;
}

.dark-red-tag:hover {
    background-color: #7f131ab2 !important;
}

.green-tag {
    background-color: #00AF4D !important;
    color: #ffffff !important;
}

.green-tag:hover {
    background-color: #00af4cb2 !important;
}

.dark-green-tag {
    background-color: #004A2D !important;
    color: #ffffff !important;
}

.dark-green-tag:hover {
    background-color: rgba(0, 175, 76, 0.438)important;
}

.sand-green-tag {
    background-color: #6F947A !important;
    color: #ffffff !important;
}

.sand-green-tag:hover {
    background-color: #6f947ab4 !important;
}

.blue-tag {
    background-color: #0099D4 !important;
    color: #ffffff !important;
}

.blue-tag:hover {
    background-color: #0098d4b0 !important;
}

.dark-blue-tag {
    background-color: #00395E !important;
    color: #ffffff !important;
}

.dark-blue-tag:hover {
    background-color: rgba(0, 152, 212, 0.479)important;
}

.yellow-tag {
    background-color: #F7D112 !important;
    color: #ffffff !important;
}

.yellow-tag:hover {
    background-color: #f7d112a8 !important;
}

.dark-yellow-tag {
    background-color: #FBAB18 !important;
    color: #ffffff !important;
}

.dark-yellow-tag:hover {
    background-color: #fbac18b7 !important;
}

.bright-yellow-tag {
    background-color: #FFCD03 !important;
    color: #ffffff !important;
}

.bright-yellow-tag:hover {
    background-color: #ffcd03b6 !important;
}

.black-tag {
    background-color: #151515 !important;
    color: #ffffff !important;
}

.black-tag:hover {
    background-color: #504e4e !important;
}

.dark-stone-gray-tag {
    background-color: #646765 !important;
    color: #ffffff !important;
}

.dark-stone-gray-tag:hover {
    background-color: #646765d2 !important;
}

.medium-lavender-tag {
    background-color: #967584 !important;
    color: #ffffff !important;
}

.medium-lavender-tag:hover {
    background-color: #967584bd !important;
}