.vpo-personalization-numbering-on .vpo-personalization-step-number {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    margin: 0;
    border-radius: 50%;
    background: var(--vpo-tier-accent, var(--vpo-border-selected, #2e7d32));
    color: #fff !important;
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-decoration: none;
}
.vpo-personalization-numbering-on .vpo-personalization-step-number[hidden],
.vpo-personalization-numbering-on .vpo-personalization-step-heading[hidden] {
    display: none !important;
}
.vpo-personalization-numbering-on .vpo-personalization-step-label {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 11px;
    text-align: left;
}
.vpo-personalization-numbering-on .vpo-tier-fields > .vpo-td-layer-selector:first-child {
    margin-top: -4px !important;
}
.vpo-personalization-numbering-on .vpo-td-layer-selector > .vpo-personalization-step-label {
    margin-bottom: 8px !important;
}
.vpo-personalization-numbering-on .vpo-tier-fields-inline-row:has(> .vpo-personalization-step-heading:not([hidden])) {
    margin-top: 3px !important;
}
.vpo-personalization-numbering-on .vpo-personalization-step-heading {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
    padding: 0 !important;
    /* Transfer 6px of the existing gap below this heading to the gap above it.
       The shared row normalizer owns inline margins and padding. */
    position: relative;
    top: 6px;
    color: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
}
.vpo-personalization-numbering-on .vpo-tier-svg-checkbox-row.vpo-personalization-step-label > .vpo-personalization-step-number {
    margin-right: 3px;
}
.vpo-personalization-numbering-on .vpo-tier-svg-checkbox-row.vpo-personalization-step-label {
    display: inline-flex;
    justify-content: flex-start;
    gap: 6px;
    width: auto;
    max-width: 100%;
}
.vpo-personalization-numbering-on .vpo-tier-svg-checkbox-row.vpo-personalization-step-label > .vpo-tier-field-toggle-thumb {
    margin-left: 0 !important;
}
#vpo-product-options .vpo-option-group.vpo-personalization-numbering-on .vpo-tier-option.vpo-tier-selected > .vpo-tier-fields:not(.vpo-tier-items-hidden):has(> .vpo-tier-field--variants:last-child[data-field-mode="checkbox"]) {
    padding-bottom: 8px !important;
}
@media (max-width: 520px) {
    .vpo-personalization-numbering-on .vpo-personalization-step-label {
        position: relative;
        padding-left: var(--vpo-step-label-padding, 10px) !important;
    }
    .vpo-personalization-numbering-on .vpo-personalization-step-label > .vpo-personalization-step-number {
        position: absolute;
        left: var(--vpo-step-number-left, -16px);
        top: 50%;
        transform: translateY(-50%);
        width: 20px;
        height: 20px;
        margin: 0;
        font-size: 12px !important;
    }
}
/* A one-choice tier needs no selection indicator. */
.vpo-type-tiers.vpo-tier-single-choice .vpo-tier-radio {
    display: none !important;
}
