1 files changed, 33 insertions, 14 deletions

diff --git a/core/css/inputs.css b/core/css/inputs.css
index fdb56a88bca..8e9d517bc90 100644
--- a/core/css/inputs.css
+++ b/core/css/inputs.css
@@ -77,6 +77,10 @@ input, textarea, select, button, div[contenteditable=true], div[contenteditable=
   font-family: var(--font-face) !important;
 }
 
+.select2-container.select2-drop-above .select2-choice {
+  background-image: unset !important;
+}
+
 /* Simple selector to allow easy overriding */
 select,
 button:not(.button-vue),
@@ -107,6 +111,7 @@ button:not(.button-vue), .button,
   background-color: var(--color-main-background);
   color: var(--color-main-text);
   border: 1px solid var(--color-border-dark);
+  font-size: var(--default-font-size);
   outline: none;
   border-radius: var(--border-radius);
   cursor: text;
@@ -319,7 +324,7 @@ input[type=reset]:disabled {
   cursor: default;
 }
 
-input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input),
+input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(.select2-input):not(.action-input__input),
 select,
 div[contenteditable=true],
 textarea {
@@ -335,7 +340,7 @@ textarea {
   text-overflow: ellipsis;
   cursor: pointer;
 }
-input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(:disabled):hover, input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(:disabled):focus, input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(:disabled):active,
+input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(.select2-input):not(.action-input__input):not(:disabled):hover, input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(.select2-input):not(.action-input__input):not(:disabled):focus, input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(.select2-input):not(.action-input__input):not(:disabled):active,
 select:not(:disabled):hover,
 select:not(:disabled):focus,
 select:not(:disabled):active,
@@ -347,13 +352,18 @@ textarea:not(:disabled):focus,
 textarea:not(:disabled):active {
   border-color: var(--color-primary-element);
 }
-input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(:disabled):focus,
+input:not([type=range]):not(.input-field__input):not([type=submit]):not([type=button]):not([type=reset]):not(.multiselect__input):not(.select2-input):not(.action-input__input):not(:disabled):focus,
 select:not(:disabled):focus,
 div[contenteditable=true]:not(:disabled):focus,
 textarea:not(:disabled):focus {
   cursor: text;
 }
 
+.multiselect__input, .select2-input {
+  background-color: var(--color-main-background);
+  color: var(--color-main-text);
+}
+
 textarea, div[contenteditable=true] {
   padding: 12px;
   height: auto;
@@ -414,9 +424,10 @@ input[type=text], input[type=password], input[type=email] {
   /* only show confirm borders if input is not focused */
 }
 input[type=text] + .icon-confirm, input[type=password] + .icon-confirm, input[type=email] + .icon-confirm {
-  margin-left: -8px !important;
+  margin-left: -13px !important;
   border-left-color: transparent !important;
-  border-radius: 0 var(--border-radius) var(--border-radius) 0 !important;
+  border-radius: 0 var(--border-radius-large) var(--border-radius-large) 0 !important;
+  border-width: 2px;
   background-clip: padding-box;
   /* Avoid background under border */
   background-color: var(--color-main-background) !important;
@@ -640,11 +651,14 @@ div.select2-container-multi .select2-choices, div.select2-container-multi.select
   background: var(--color-main-background);
   color: var(--color-text-lighter) !important;
   box-sizing: content-box;
-  border-radius: var(--border-radius);
-  border: 1px solid var(--color-border-dark);
+  border-radius: var(--border-radius-large);
+  border: 2px solid var(--color-border-dark);
   margin: 0;
-  padding: 2px 0;
-  min-height: auto;
+  padding: 6px;
+  min-height: 44px;
+}
+div.select2-container-multi .select2-choices:focus-within, div.select2-container-multi.select2-container-active .select2-choices:focus-within {
+  border-color: var(--color-primary);
 }
 div.select2-container-multi .select2-choices .select2-search-choice, div.select2-container-multi.select2-container-active .select2-choices .select2-search-choice {
   line-height: 20px;
@@ -661,6 +675,9 @@ div.select2-container-multi .select2-choices .select2-search-choice .select2-sea
 }
 div.select2-container-multi .select2-choices .select2-search-field input, div.select2-container-multi.select2-container-active .select2-choices .select2-search-field input {
   line-height: 20px;
+  min-height: 28px;
+  max-height: 28px;
+  color: var(--color-main-text);
 }
 div.select2-container-multi .select2-choices .select2-search-field input.select2-active, div.select2-container-multi.select2-container-active .select2-choices .select2-search-field input.select2-active {
   background: none !important;
@@ -683,12 +700,14 @@ div.select2-container a.select2-choice {
   background: var(--color-main-background);
   color: var(--color-text-lighter) !important;
   box-sizing: content-box;
-  border-radius: var(--border-radius);
-  border: 1px solid var(--color-border-dark);
+  border-radius: var(--border-radius-large);
+  border: 2px solid var(--color-border-dark);
   margin: 0;
-  padding: 2px 0;
-  padding-left: 6px;
-  min-height: auto;
+  padding: 6px 12px;
+  min-height: 44px;
+}
+div.select2-container a.select2-choice:focus-within {
+  border-color: var(--color-primary);
 }
 div.select2-container a.select2-choice .select2-search-choice {
   line-height: 20px;