.form-control { width: 100%; height: initial; min-height: calc(1.8125rem + 2px); padding: .25rem .7rem; appearance: none; background-color: initial; border-radius: .2rem; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; } .form-control::placeholder { color: #6c757d; opacity: 1; } .form-control-lg { height: initial; min-height: calc(2.0875rem + 2px); padding: .35rem 1rem; font-size: .925rem; border-radius: .3rem } .btn { display: inline-block; font-weight: 400; line-height: 1.5; text-align: center; vertical-align: middle; cursor: pointer; user-select: none; padding: .25rem .7rem; font-size: .875rem; border-radius: .2rem; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; } .form-select { width: 100%; padding: .25rem 1.7rem .25rem .7rem; color: map-get($theme-colors, text-3); background-color: map-get($theme-colors, background-1); background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .7rem center; background-size: 16px 12px; border: 1px solid #ced4da; border-radius: .2rem; appearance: none; } .btn-group-sm > .btn, .btn-sm { padding: .15rem .5rem; font-size: .75rem; border-radius: .1rem; } .input-group > :not(:first-child):not(.dropdown-menu) { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; } .input-group > .dropdown-toggle:nth-last-child(n+3), .input-group > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) { border-top-right-radius: 0; border-bottom-right-radius: 0; } .input-group-text { display: flex; align-items: center; padding: .25rem .7rem; background-color: map-get($theme-colors, background-2); #border-right-width: 0; } .input-group-text:not(:last-child) { border-right-width: 0; } .is-invalid input, .is-invalid select { border: 1px solid var(--bs-danger); } .is-invalid .invalid-feedback { display: block; }