[x-cloak] {
    display: none !important;
}

.active-image {
    border: 2px solid #00c853 !important;
    box-shadow: 0 0 5px #00c85366;
    transform: scale(1.05);
    transition: all 0.15s ease-in-out;
}

.error-message {
    color: #fd3550;
    width: 100%;
    margin-top: .25rem;
    font-size: .875em;
}

.tooltip {
    font-family: var(--bs-body-font-family), sans-serif;
}

/* |-------- Create Product --------| */
#product-badge-container {
    background-color: #f9f9f9;
    border-radius: 12px;
    padding: 20px;
}

#product-badge-container .fw-bold {
    font-size: 1.1rem;
    margin-bottom: 16px;
    color: #333;
}

.badge-img {
    border-radius: 8px;
    transition: all 0.3s ease;
    overflow: hidden;
}

.badge-img:hover {
    opacity: 0.8;
}

.black-white-img img {
    filter: grayscale(100%);
    transition: all 0.3s ease;
}

.black-white-img:hover img {
    filter: grayscale(0%);
}

.badge-img img {
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.badge-img:hover img {
    transform: scale(1.1);
}

#product-badge-container input[type="checkbox"] {
    display: none;
}

.col {
    margin-bottom: 12px;
}
/* |-------- /Create Product --------| */