/* ── Field — price ───────────────────────────────────────────────────────── */

.field--price {
    display:     flex;
    align-items: center;
    flex-wrap:   wrap;
    column-gap:  8px;
    cursor:      text;
}

.field--price:not(.field--focused):not(.field--invalid):not(.field--valid):hover {
    border-color: var(--field-border-hover);
}

.field--price .formbuilder-mask {
    flex:        1 1 auto;
    font-size:   var(--field-font-size, 1rem);
    font-family: inherit;
}

.field--price .field__action {
    flex:            0 0 auto;
    width:           30px;
    height:          30px;
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    padding:         0;
    background:      rgba(99, 102, 241, .07);
    border:          1.5px solid rgba(99, 102, 241, .18);
    border-radius:   7px;
    color:           var(--field-border-focus);
    font-size:       1rem;
    cursor:          pointer;
    transition:      background .15s, border-color .15s;
}

.field--price .field__action:hover {
    background:   rgba(99, 102, 241, .14);
    border-color: rgba(99, 102, 241, .35);
}

.field--price .field__feedback {
    flex: 0 0 100%;
}
