/**
 * Product variant FO styles
 *
 * @author      Difadi.com <soporte@difadi.com>
 * @copyright   2026 Difadi.com
 * @license     Commercial
 */
.dfdproductvariants {
    width: 100%;
}

.dfdproductvariants .dfdproductvariants-group {
    padding-bottom: 10px;
}

.dfdproductvariants .dfdproductvariants-label {
    font-size: var(--font-sm);
    font-weight: 600;
}

.dfdproductvariants .dfdproductvariants-options {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spaces-sm);
    row-gap: var(--spaces-md);
    align-items: flex-start;
    position: relative;
}

.dfdproductvariants .dfdproductvariants-options a {
    position: relative;
    display: flex;
}

.dfdproductvariants .dfdproductvariants-options a::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1.5px;
    bottom: -10px;
}

.dfdproductvariants .dfdproductvariants-options a.is-selected::after {
    border-color: var(--color-primary);
    background-color: var(--color-primary);
}

.dfdproductvariants .dfdproductvariants-finish {
    display: inline-flex;
    min-width: 70px;
    min-height: 20px;
    padding: 8px 10px;
    align-items: center;
    justify-content: center;
    background: var(--color-grey);
    line-height: 1;
    text-transform: uppercase;
    transition: all .15s ease;
    font-size: var(--font-xs);
}

.dfdproductvariants .dfdproductvariants-stone-current {
    display: inline-block;
    text-transform: lowercase;
}

.dfdproductvariants .dfdproductvariants-stone-current::first-letter {
    text-transform: uppercase;
}

.dfdproductvariants .dfdproductvariants-stone-image {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 100%;
    overflow: hidden;
    border: var(--border-width) solid var(--border-color-2);
} 

.dfdproductvariants .dfdproductvariants-stone-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}