.wcpvs-select-wrap {
    position: relative;
    width: 100%;
}

.wcpvs-select-wrap > select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.single-product form.variations_form .wcpvs-wrap,
.wcpvs-wrap {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 4px 0 !important;
}

/* Reset aggressive theme button styles only for our swatches. */
.single-product form.variations_form button.wcpvs-swatch,
button.wcpvs-swatch {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    box-sizing: border-box !important;
    width: auto !important;
    max-width: none !important;
    min-width: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border: 1px solid #d8d8d8 !important;
    border-radius: 9px !important;
    outline: 0 !important;
    background: #fff !important;
    color: #222 !important;
    font: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: 1 !important;
    text-transform: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    overflow: visible !important;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, opacity .18s ease !important;
}

.single-product form.variations_form button.wcpvs-swatch:hover:not(.is-disabled),
button.wcpvs-swatch:hover:not(.is-disabled) {
    border-color: #555 !important;
    transform: translateY(-1px);
}

.single-product form.variations_form button.wcpvs-swatch.is-selected,
button.wcpvs-swatch.is-selected {
    border-color: #111 !important;
    box-shadow: 0 0 0 2px rgba(17,17,17,.12) !important;
}

.single-product form.variations_form button.wcpvs-swatch.is-disabled,
button.wcpvs-swatch.is-disabled {
    opacity: .35 !important;
    cursor: not-allowed !important;
    filter: grayscale(1);
}

.wcpvs-swatch.is-disabled::after {
    content: '';
    position: absolute;
    left: -4px;
    right: -4px;
    top: 50%;
    height: 1px;
    background: #a33;
    transform: rotate(-35deg);
    transform-origin: center;
    z-index: 3;
}

/* Color swatch: no rectangular outer border. */
.single-product form.variations_form button.wcpvs-swatch.wcpvs-color,
button.wcpvs-swatch.wcpvs-color {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: var(--wcpvs-el-color-inner-gap) !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
}

.single-product form.variations_form button.wcpvs-swatch.wcpvs-color:hover:not(.is-disabled),
button.wcpvs-swatch.wcpvs-color:hover:not(.is-disabled) {
    border: 0 !important;
    box-shadow: 0 0 0 1px rgba(0,0,0,.22) !important;
    transform: none;
}

.single-product form.variations_form button.wcpvs-swatch.wcpvs-color.is-selected,
button.wcpvs-swatch.wcpvs-color.is-selected {
    border: 0 !important;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #222 !important;
}

.wcpvs-color-dot {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    border-radius: 50% !important;
    background: var(--wcpvs-color, #ddd) !important;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.10) !important;
}

/* Variation-image swatch: fixed thumbnail size, regardless of theme image styles. */
.single-product form.variations_form button.wcpvs-swatch.wcpvs-variation-image,
.single-product form.variations_form button.wcpvs-swatch.wcpvs-image,
button.wcpvs-swatch.wcpvs-variation-image,
button.wcpvs-swatch.wcpvs-image {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
    min-height: 64px !important;
    max-width: 64px !important;
    max-height: 64px !important;
    padding: 2px !important;
    border: 1px solid #dedede !important;
    border-radius: 8px !important;
    background: #fff !important;
    overflow: hidden !important;
    line-height: 0 !important;
}

.single-product form.variations_form button.wcpvs-swatch.wcpvs-variation-image.is-selected,
.single-product form.variations_form button.wcpvs-swatch.wcpvs-image.is-selected,
button.wcpvs-swatch.wcpvs-variation-image.is-selected,
button.wcpvs-swatch.wcpvs-image.is-selected {
    border-color: #111 !important;
    box-shadow: 0 0 0 2px rgba(17,17,17,.12) !important;
}

.single-product form.variations_form button.wcpvs-swatch.wcpvs-variation-image img,
.single-product form.variations_form button.wcpvs-swatch.wcpvs-image img,
button.wcpvs-swatch.wcpvs-variation-image img,
button.wcpvs-swatch.wcpvs-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 6px !important;
    object-fit: cover !important;
    object-position: center !important;
    box-shadow: none !important;
}

.wcpvs-label {
    white-space: nowrap;
}

.single-product table.variations td.value .wcpvs-select-wrap {
    width: 100%;
}

@media (max-width: 600px) {
    .single-product form.variations_form .wcpvs-wrap,
    .wcpvs-wrap {
        gap: 8px !important;
    }

    .single-product form.variations_form button.wcpvs-swatch,
    button.wcpvs-swatch {
        min-width: 38px !important;
        min-height: 38px !important;
        padding: 7px 10px !important;
    }

    .single-product form.variations_form button.wcpvs-swatch.wcpvs-color,
    button.wcpvs-swatch.wcpvs-color {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
    }

    .wcpvs-color-dot {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        min-height: 28px !important;
    }

    .single-product form.variations_form button.wcpvs-swatch.wcpvs-variation-image,
    .single-product form.variations_form button.wcpvs-swatch.wcpvs-image,
    button.wcpvs-swatch.wcpvs-variation-image,
    button.wcpvs-swatch.wcpvs-image {
        width: 56px !important;
        height: 56px !important;
        min-width: 56px !important;
        min-height: 56px !important;
        max-width: 56px !important;
        max-height: 56px !important;
    }
}

/* Archive / shop loop swatches */
.wcpvs-archive {
    display: block !important;
    width: 100% !important;
    margin: 8px 0 10px !important;
    clear: both !important;
}

.wcpvs-archive .wcpvs-archive-group {
    margin: 5px 0 !important;
}

.wcpvs-archive .wcpvs-wrap {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    margin: 0 !important;
}

.wcpvs-archive button.wcpvs-swatch {
    min-width: 34px !important;
    min-height: 34px !important;
    padding: 6px 9px !important;
    border-radius: 7px !important;
    font-size: 12px;
    line-height: 1 !important;
    z-index: 5 !important;
}

.wcpvs-archive button.wcpvs-swatch.wcpvs-color {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    padding: 3px !important;
}

.wcpvs-archive button.wcpvs-swatch.wcpvs-color .wcpvs-color-dot {
    width: 24px !important;
    height: 24px !important;
}

.wcpvs-archive button.wcpvs-swatch.wcpvs-variation-image {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    padding: 2px !important;
    overflow: hidden !important;
}

.wcpvs-archive button.wcpvs-swatch.wcpvs-variation-image img {
    display: block !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    object-fit: cover !important;
    border-radius: 5px !important;
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 767px) {
    .wcpvs-archive .wcpvs-wrap { gap: 6px !important; }
    .wcpvs-archive button.wcpvs-swatch.wcpvs-variation-image {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
    }
    .wcpvs-archive button.wcpvs-swatch.wcpvs-variation-image img {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
    }
}

/* Elementor Loop Item widget */
.wcpvs-elementor-widget {
    width: 100%;
    --wcpvs-el-gap: 7px;
    --wcpvs-el-image-size: 46px;
    --wcpvs-el-image-radius: 7px;
    --wcpvs-el-image-border-width: 1px;
    --wcpvs-el-image-border-color: #dedede;
    --wcpvs-el-image-inner-gap: 3px;
    --wcpvs-el-color-size: 30px;
    --wcpvs-el-color-radius: 50%;
    --wcpvs-el-color-border-width: 1px;
    --wcpvs-el-color-inner-gap: 3px;
    --wcpvs-el-color-border-color: rgba(0,0,0,.10);
    --wcpvs-el-radius: 7px;
    --wcpvs-el-button-min-width: 34px;
    --wcpvs-el-button-min-height: 34px;
    --wcpvs-el-button-selected-color: #111111;
    --wcpvs-el-button-selected-width: 2px;
    --wcpvs-el-color-selected-color: #111111;
    --wcpvs-el-color-selected-width: 2px;
    --wcpvs-el-image-selected-color: #111111;
    --wcpvs-el-image-selected-width: 2px;
    --wcpvs-el-justify: flex-start;
    --wcpvs-el-wrap: wrap;
}

.wcpvs-elementor-widget .wcpvs-elementor-label {
    display: block;
    margin: 0 0 7px;
    line-height: 1.5;
}

.wcpvs-elementor-widget .wcpvs-archive {
    margin: 0 !important;
}

.wcpvs-elementor-widget .wcpvs-wrap {
    gap: var(--wcpvs-el-gap) !important;
    justify-content: var(--wcpvs-el-justify) !important;
    flex-wrap: var(--wcpvs-el-wrap, wrap) !important;
}

/* Button/text swatches: controls only affect actual button swatches. */
.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-button {
    min-width: var(--wcpvs-el-button-min-width) !important;
    min-height: var(--wcpvs-el-button-min-height) !important;
    border-radius: var(--wcpvs-el-radius) !important;
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    font-style: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
}

.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-button .wcpvs-label {
    font: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    font-family: inherit !important;
    font-style: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-transform: inherit !important;
    color: inherit !important;
}

.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-button.is-selected {
    border-style: solid !important;
    border-color: var(--wcpvs-el-button-selected-color) !important;
    border-width: var(--wcpvs-el-button-selected-width) !important;
    box-shadow: none !important;
}

/* Color swatches: size/radius/border are applied to the color itself. */
.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-color {
    width: var(--wcpvs-el-color-size) !important;
    height: var(--wcpvs-el-color-size) !important;
    min-width: var(--wcpvs-el-color-size) !important;
    min-height: var(--wcpvs-el-color-size) !important;
    /* The Elementor control defines the real empty space between the inner color and the outer/selected ring. */
    padding: var(--wcpvs-el-color-inner-gap, 3px) !important;
    box-sizing: border-box !important;
    border-radius: var(--wcpvs-el-color-radius) !important;
}

.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-color .wcpvs-color-dot {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: var(--wcpvs-el-color-radius) !important;
    box-shadow: inset 0 0 0 var(--wcpvs-el-color-border-width) var(--wcpvs-el-color-border-color) !important;
}

.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-color.is-selected {
    border-radius: var(--wcpvs-el-color-radius) !important;
    box-shadow: 0 0 0 var(--wcpvs-el-color-selected-width) var(--wcpvs-el-color-selected-color) !important;
}

/* Variation image swatches: image-specific controls don't leak into color/button styles. */
.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-variation-image,
.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-image {
    width: var(--wcpvs-el-image-size) !important;
    height: var(--wcpvs-el-image-size) !important;
    min-width: var(--wcpvs-el-image-size) !important;
    min-height: var(--wcpvs-el-image-size) !important;
    max-width: var(--wcpvs-el-image-size) !important;
    max-height: var(--wcpvs-el-image-size) !important;
    border-width: var(--wcpvs-el-image-border-width) !important;
    border-color: var(--wcpvs-el-image-border-color) !important;
    border-radius: var(--wcpvs-el-image-radius) !important;
    padding: var(--wcpvs-el-image-inner-gap, 3px) !important;
    box-sizing: border-box !important;
}

.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-variation-image.is-selected,
.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-image.is-selected {
    border-style: solid !important;
    border-color: var(--wcpvs-el-image-selected-color) !important;
    border-width: var(--wcpvs-el-image-selected-width) !important;
    box-shadow: none !important;
}

.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-variation-image img,
.wcpvs-elementor-widget button.wcpvs-swatch.wcpvs-image img {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: 100% !important;
    border-radius: max(0px, calc(var(--wcpvs-el-image-radius) - var(--wcpvs-el-image-inner-gap, 3px))) !important;
    object-fit: cover !important;
}

.wcpvs-elementor-placeholder {
    padding: 12px 14px;
    border: 1px dashed #c8c8c8;
    border-radius: 6px;
    background: #fafafa;
    color: #666;
    font-size: 12px;
    line-height: 1.7;
}

/* Elementor visible-items limit indicator */
.wcpvs-elementor-widget .wcpvs-more-indicator {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    min-width: 28px !important;
    min-height: 28px !important;
    padding: 0 5px !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: currentColor !important;
    font: inherit !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 1px !important;
    white-space: nowrap !important;
    pointer-events: none !important;
    opacity: .72;
}

/* Native WooCommerce archive settings helpers */
.wcpvs-native-archive .wcpvs-archive-label {
    display: block;
}

.wcpvs-native-archive .wcpvs-more-indicator {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    min-width: 28px !important;
    min-height: 28px !important;
    padding: 0 5px !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: currentColor !important;
    font: inherit !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 1px !important;
    white-space: nowrap !important;
    pointer-events: none !important;
    opacity: .72;
}