/* Odcienie odpowiadają materiałom z base/mockups; klucze wariantów pozostają bez zmian. */
body.wizard-page [data-final-product-variant] .product-color-choices {
    gap: 8px;
    padding-top: 0;
    overflow: visible;
}
body.wizard-page [data-final-product-variant] .stage1-choice-strip .stage1-choice-button.product-color-choice {
    position: relative;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    padding: 3px;
    border: 2px solid transparent;
    border-radius: 50%;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    cursor: pointer;
}
body.wizard-page [data-final-product-variant] .product-color-choice[hidden] { display: none !important; }
.product-color-swatch {
    display: block;
    width: 22px;
    height: 22px;
    border: 1px solid rgba(0, 0, 0, .22);
    border-radius: 50%;
    background: var(--product-swatch-color);
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, .25);
}
body.wizard-page [data-final-product-variant] .stage1-choice-strip .stage1-choice-input:checked + .product-color-choice {
    border-color: #962c50;
    background: #fff5f8;
    box-shadow: none;
}
body.wizard-page [data-final-product-variant] .stage1-choice-strip .stage1-choice-input:focus-visible + .product-color-choice {
    outline: 2px solid #962c50;
    outline-offset: 3px;
}
.product-color-choice::after {
    content: attr(data-color-name);
    position: absolute;
    bottom: calc(100% + 4px);
    left: 50%;
    transform: translateX(-50%);
    padding: 3px 6px;
    border-radius: 5px;
    background: #344351;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    pointer-events: none;
    visibility: hidden;
    z-index: 2;
}
.stage1-choice-input:focus-visible + .product-color-choice::after { visibility: visible; }
@media (hover: hover) {
    .product-color-choices:has(.product-color-choice:hover) .product-color-choice::after { visibility: hidden; }
    .product-color-choices:has(.product-color-choice:hover) .product-color-choice:hover::after { visibility: visible; }
}
@media (max-width: 767.98px) {
    body.wizard-page [data-final-product-variant] .stage1-choice-strip .stage1-choice-button.product-color-choice {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
        min-width: 40px;
        min-height: 40px;
        padding: 5px;
    }
    .product-color-swatch { width: 26px; height: 26px; }
}
@media (forced-colors: active) {
    .product-color-swatch { forced-color-adjust: none; }
    body.wizard-page [data-final-product-variant] .stage1-choice-strip .stage1-choice-input:checked + .product-color-choice { border-color: Highlight; }
}