.selectbox{width:100%;display:block;position:relative}.selectbox:before{background-color:var(--color-primary);content:"";pointer-events:none;z-index:1;border-radius:0 12px 12px 0;width:3.5em;height:100%;position:absolute;top:0;right:0}.selectbox:after{content:"";pointer-events:none;z-index:2;border-bottom:3px solid #fff;border-right:3px solid #fff;width:10px;height:10px;position:absolute;top:50%;right:1.3em;transform:translate(50%,-60%)rotate(45deg)}.selectbox select{appearance:none;border:2px solid var(--color-primary);color:#5a5a5a;width:100%;min-width:230px;height:4rem;font-family:var(--font-sans);cursor:pointer;background-color:#fffbfd;border-radius:12px;padding:.5em 4em .5em 1.5em;font-size:1.25rem;font-weight:700;transition:all .3s}.selectbox select option{color:#333;background-color:#fff;padding:10px;font-size:1.1rem}.selectbox select:hover{background-color:#fff;box-shadow:0 2px 8px #ff9ebb33}.selectbox select:focus{border-color:var(--color-secondary);outline:none;box-shadow:0 0 0 3px #a2d2ff4d}.selectbox select.error{border-color:var(--color-error);background-color:#fff0f0}
.indicator{transition-property:width;transition-duration:2s;transition-timing-function:ease-out}.low-rate{background-image:linear-gradient(90deg,#fbd5fb,#95e9f3)}.middle-rate{background-image:linear-gradient(90deg,#f0f590,#04ff0b)}.high-rate{background-image:linear-gradient(90deg,#fedc40,#fea434 39%,#ff4821)}