.prw-box {
    direction: rtl;
    margin: 12px 0;
    padding: 0;
}

.prw-title {
    font-weight: 700;
    margin: 0 0 .5rem;
}

.prw-grid {
    display: grid;
    grid-template-columns: 1fr 0px 1fr;
    gap: .5rem 7px;
    align-items: center;
}

.prw-field {
    position: relative;
}

.prw-field label {
    font-size:  12px;
    margin:  0;
    width:  max-content;
    background:  #fff;
    position:  absolute;
    right:  10px;
    top:  0;
    transform:  translateY(-50%);
    padding:  0 5px;
}

.prw-input {
    height: 40px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 0 .75rem;
    font-size: 15px;
    margin: 0!important;
    width:  100%;
}

.prw-dash {
    justify-self: center;
    color: #6b7280;
}

.prw-slider-wrap {
    margin-top: 20px;
}

.prw-target {
    box-shadow: none;
    border: 0;
    background: #e5effa;
    height: 3px;
    border-radius: 999px;
    direction: rtl;
}

.prw-connect {
    background: #1d4ed8;
}

.prw-handle {
    width: 18px;
    height: 18px;
    right: -9px;
    top: -8px;
    border-radius: 999px;
    border: 2px solid #1d4ed8;
    background: #fff;
    box-shadow: 0 0 0 2px #fff;
}

.prw-horizontal .prw-handle:before, .prw-horizontal .prw-handle:after {
    display: none;
}

.prw-horizontal .prw-handle {
    width:  15px;
    height:  15px;
    border:  none;
    background: var(--color-3);
    border-radius:  50%;
}

.prw-actions {
    margin-top: 20px;
}

.prw-btn {
    width: 100%;
    height: 40px;
    border: 0;
    border-radius: 6px;
    background: var(--color-3);
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}

.prw-base {
    position:  relative;
}

.prw-origin {
    position:  absolute;
    width:  100%;
    top:  -6px;
}

.prw-handle.prw-handle-upper {
    position:  relative;
    right:  -10px;
    top:  0;
    bottom:  0;
    left:  0;
}

.prw-origin:last-child {
    z-index:  8 !important;
}