/* Buttons */
.vp-button {
    width: 80px;
    height: 30px;
    background: #FFFFFF;
    border: 0.25px solid #E4E4E4;
    box-sizing: border-box;
    box-shadow: 0.5px 0.5px 0.5px rgb(0 0 0 / 10%);
    border-radius: 2px;
    line-height: 30px;
    font-size: 14px;
    text-align: center;
    color: #696969;
    cursor: pointer;
    /* No-selection allowed for buttons */
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                supported by Chrome, Edge, Opera and Firefox */
}
.vp-button:hover {
    background: #F8F8F8;
}
.vp-button.cancel {
    background: #E5E5E5;
    border: 0px;
}
.vp-button.cancel:hover {
    background: #DEDEDE;
}
.vp-button.add {
    background: #FFFFFF;
}
.vp-button.add:hover {
    background: #F8F8F8;
}
.vp-button.activated {
    background: #F38504;
    border: 0px;
    color: #FFFFFF;
}
.vp-button.activated:hover {
    background: #EF6B10;
}
.vp-button.disabled,
.vp-button.disabled:hover,
.vp-button:disabled,
.vp-button:disabled:hover {
    background: #E5E5E5;
    border: 0px;
    border: 0.25px solid #E4E4E4;
    color: #696969;
    cursor: not-allowed;
}

/* Cursor Pointer */
.vp-cursor {
    cursor: pointer;
}
.vp-vertical-line {
    display: inline-block;
    height: 15px;
    border-right: 1px solid var(--font-primary);
}

/* Scrollbar */
.vp-scrollbar {
    overflow-y: auto;
    --webkit-mask-position: left top;
}
.vp-scrollbar::-webkit-scrollbar {
    width: 5px;
    height: 5px;
} 
.vp-scrollbar::-webkit-scrollbar-thumb {
    border: 0.3px solid #C4C4C4;
    background: #C4C4C4;
}

/* Width selector */
.wp50 {
    width: 50px;
}
.wp80 {
    width: 80px;
}
.wp100 {
    width: 100px;
}
.wp120 {
    width: 120px;
}

.w40 {
    width: 40%;
}
.w100 {
    width: 100%;
}

/* font selector */
.fb {
    font-weight: bold;
}