/*
 * Das originale WooCommerce-Select bleibt vollständig erhalten.
 * Der Wrapper übernimmt exakt die Breite, die das Select vor der Dekoration hatte.
 */
.variations_form .mwpcs-native-select-wrap {
    position: relative !important;
    display: inline-block !important;
    width: var(--mwpcs-native-width, auto) !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

.variations_form .mwpcs-native-select-wrap > select.mwpcs-native-select {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    transition: padding-left .18s ease !important;
}

.variations_form .mwpcs-native-select-wrap.mwpcs-has-selected-color > select.mwpcs-native-select {
    padding-left: 48px !important;
}

.variations_form .mwpcs-native-select-swatch {
    position: absolute !important;
    z-index: 3 !important;
    top: 50% !important;
    left: 14px !important;
    width: 23px !important;
    height: 23px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(17, 24, 39, .32) !important;
    border-radius: 3px !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .42), 0 1px 2px rgba(17, 24, 39, .12) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-50%) scale(.82) !important;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
}

.variations_form .mwpcs-native-select-wrap.mwpcs-has-selected-color .mwpcs-native-select-swatch {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(-50%) scale(1) !important;
}

[dir="rtl"] .variations_form .mwpcs-native-select-wrap.mwpcs-has-selected-color > select.mwpcs-native-select {
    padding-right: 48px !important;
    padding-left: inherit !important;
}

[dir="rtl"] .variations_form .mwpcs-native-select-swatch {
    right: 14px !important;
    left: auto !important;
}

@media (max-width: 767px) {
    .variations_form .mwpcs-native-select-wrap.mwpcs-has-selected-color > select.mwpcs-native-select {
        padding-left: 43px !important;
    }

    .variations_form .mwpcs-native-select-swatch {
        left: 12px !important;
        width: 21px !important;
        height: 21px !important;
    }
}