@open-condo/ui 1.30.1 → 1.32.0

package/dist/styles.css

@@ -67,7 +67,7 @@
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -166,11 +166,11 @@
 .condo-alert-with-description .condo-alert-message {
   display: block;
   margin-bottom: 4px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 16px;
 }
 .condo-alert-message {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
 }
 .condo-alert-with-description .condo-alert-description {
   display: block;
@@ -278,7 +278,7 @@
   padding: 4px 15px;
   font-size: 14px;
   border-radius: 2px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   border-color: #d9d9d9;
   background: #fff;
 }
@@ -507,7 +507,7 @@
   border-left-color: #d9d9d9;
 }
 .condo-btn-ghost {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   border-color: #d9d9d9;
   background: transparent;
 }
@@ -589,7 +589,7 @@
   content: '';
 }
 .condo-btn-dashed {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   border-color: #d9d9d9;
   background: #fff;
   border-style: dashed;
@@ -875,7 +875,7 @@
   content: '';
 }
 .condo-btn-text {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   border-color: transparent;
   background: transparent;
   box-shadow: none;
@@ -959,12 +959,12 @@
 }
 .condo-btn-text:hover,
 .condo-btn-text:focus {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   background: rgba(0, 0, 0, 0.018);
   border-color: transparent;
 }
 .condo-btn-text:active {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   background: rgba(0, 0, 0, 0.028);
   border-color: transparent;
 }
@@ -2679,7 +2679,7 @@ a.condo-btn-secondary {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -2947,7 +2947,6 @@ a.condo-btn-secondary {
   text-align: right;
 }
 .condo-typography {
-  color: #222;
   word-break: break-word;
 }
 .condo-typography-break-spaces {
@@ -2978,6 +2977,9 @@ a.condo-btn-secondary {
   line-height: 20px;
   letter-spacing: -0.01em;
 }
+.condo-typography-primary {
+  color: #222;
+}
 .condo-typography-secondary {
   color: #707695;
 }
@@ -2996,6 +2998,9 @@ a.condo-btn-secondary {
 .condo-typography-danger {
   color: #ff3b30;
 }
+.condo-typography-inherit {
+  color: inherit;
+}
 .condo-typography-disabled {
   cursor: not-allowed;
   opacity: 0.5;
@@ -3307,7 +3312,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -3335,7 +3340,7 @@ span.condo-typography-ellipsis-single-line {
   min-height: 48px;
   margin-bottom: -1px;
   padding: 0 24px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: 500;
   font-size: 16px;
   background: transparent;
@@ -3372,7 +3377,7 @@ span.condo-typography-ellipsis-single-line {
 .condo-card-head .condo-tabs-top {
   clear: both;
   margin-bottom: -17px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: normal;
   font-size: 14px;
 }
@@ -3382,7 +3387,7 @@ span.condo-typography-ellipsis-single-line {
 .condo-card-extra {
   margin-left: auto;
   padding: 16px 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: normal;
   font-size: 14px;
 }
@@ -3541,7 +3546,7 @@ span.condo-typography-ellipsis-single-line {
 }
 .condo-card-meta-title {
   overflow: hidden;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: 500;
   font-size: 16px;
   white-space: nowrap;
@@ -3611,6 +3616,18 @@ span.condo-typography-ellipsis-single-line {
   transition-duration: 0.15s;
   transition-property: border-color;
 }
+.condo-card-active {
+  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #4cd174 0%, #6db8f2 100%) border-box;
+  border: 1px solid transparent;
+  box-shadow: 0 4px 14px 0 rgba(76,209,117,0.30196);
+}
+.condo-card-active .condo-card-body {
+  border: 0 solid transparent;
+}
+.condo-card-active .condo-card-head {
+  border: 0 solid transparent;
+  border-bottom: 1px solid #e1e5ed;
+}
 .condo-card-hoverable:hover {
   box-shadow: 0 4px 14px 0 rgba(178,185,217,0.4);
 }
@@ -3621,6 +3638,10 @@ span.condo-typography-ellipsis-single-line {
 .condo-card-hoverable:hover .condo-card-body {
   border-color: #fff;
 }
+.condo-card-active.condo-card-hoverable:hover {
+  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #2abb56 0%, #3996dd 100%) border-box;
+  box-shadow: 0 4px 14px 0 rgba(76,209,117,0.30196);
+}
 
 .condo-control {
   width: 40px !important;
@@ -3663,7 +3684,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -4031,7 +4052,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -4160,7 +4181,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -4195,7 +4216,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -4260,28 +4281,6 @@ span.condo-typography-ellipsis-single-line {
 .condo-checkbox-wrapper .condo-checkbox-inner::after {
   transition: none;
 }
-.condo-checkbox-wrapper .condo-checkbox-input:focus + .condo-checkbox-inner {
-  background: linear-gradient(90deg, #4cd174 0%, #6db8f2 100%) border-box;
-  border-color: transparent;
-}
-.condo-checkbox-wrapper .condo-checkbox-input:focus + .condo-checkbox-inner::before {
-  position: absolute;
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-  background: #fff border-box;
-  border-radius: 3px;
-  content: "";
-}
-.condo-checkbox-wrapper .condo-checkbox-indeterminate > .condo-checkbox-input:focus + .condo-checkbox-inner::before {
-  position: absolute;
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-  background: linear-gradient(90deg, #e2ffeb 0%, #e7f4ff 100%) border-box;
-  border-radius: 3px;
-  content: "";
-}
 .condo-checkbox-wrapper .condo-checkbox-indeterminate > .condo-checkbox-inner::after {
   width: 12px;
   height: 4px;
@@ -4297,34 +4296,9 @@ span.condo-typography-ellipsis-single-line {
   border-radius: 3px;
   content: "";
 }
-.condo-checkbox-wrapper .condo-checkbox-indeterminate.condo-checkbox-disabled > .condo-checkbox-inner::after {
-  background: #d0d3e5;
-}
-.condo-checkbox-wrapper .condo-checkbox-indeterminate.condo-checkbox-disabled > .condo-checkbox-inner::before {
-  position: absolute;
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-  background: #fff border-box;
-  border-radius: 3px;
-  content: "";
-}
 .condo-checkbox-wrapper .condo-checkbox-checked::after {
   border: none;
 }
-.condo-checkbox-wrapper .condo-checkbox-checked > .condo-checkbox-input:focus + .condo-checkbox-inner {
-  background: linear-gradient(90deg, #4cd174 0%, #6db8f2 100%) border-box;
-  border-color: transparent;
-}
-.condo-checkbox-wrapper .condo-checkbox-checked > .condo-checkbox-input:focus + .condo-checkbox-inner::before {
-  position: absolute;
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-  background: linear-gradient(90deg, #e2ffeb 0%, #e7f4ff 100%) border-box;
-  border-radius: 3px;
-  content: "";
-}
 .condo-checkbox-wrapper .condo-checkbox-checked > .condo-checkbox-inner {
   box-sizing: content-box;
   background: #d0d3e5 border-box;
@@ -4351,6 +4325,12 @@ span.condo-typography-ellipsis-single-line {
   transform: rotate(48deg) scale(1) translate(-50%, -50%);
   transition: none;
 }
+.condo-checkbox-wrapper .condo-checkbox-disabled > .condo-checkbox-inner {
+  border-color: #e1e5ed !important;
+}
+.condo-checkbox-wrapper .condo-checkbox-disabled > .condo-checkbox-inner {
+  background-color: #f2f4f6;
+}
 .condo-checkbox-wrapper .condo-checkbox-disabled.condo-checkbox-checked > .condo-checkbox-inner::before {
   background: #f2f4f6;
 }
@@ -4358,11 +4338,30 @@ span.condo-typography-ellipsis-single-line {
   border-color: #d0d3e5;
   border-image-source: none;
 }
-.condo-checkbox-wrapper .condo-checkbox-disabled > .condo-checkbox-inner {
-  border-color: #e1e5ed !important;
+.condo-checkbox-wrapper .condo-checkbox-input:focus + .condo-checkbox-inner {
+  background: linear-gradient(90deg, #4cd174 0%, #6db8f2 100%) border-box;
+  border-color: transparent;
 }
-.condo-checkbox-wrapper .condo-checkbox-disabled > .condo-checkbox-inner {
-  background-color: #f2f4f6;
+.condo-checkbox-wrapper .condo-checkbox-input:focus + .condo-checkbox-inner::before {
+  position: absolute;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  background: #fff border-box;
+  border-radius: 3px;
+  content: "";
+}
+.condo-checkbox-wrapper .condo-checkbox-indeterminate.condo-checkbox-disabled > .condo-checkbox-inner::after {
+  background: #d0d3e5;
+}
+.condo-checkbox-wrapper .condo-checkbox-indeterminate.condo-checkbox-disabled > .condo-checkbox-inner::before {
+  position: absolute;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  background: #fff border-box;
+  border-radius: 3px;
+  content: "";
 }
 .condo-checkbox-wrapper .condo-checkbox::after {
   position: absolute;
@@ -4373,25 +4372,47 @@ span.condo-typography-ellipsis-single-line {
   background-color: transparent;
   border-radius: 4px;
   visibility: visible;
-  content: '';
+  content: "";
 }
 .condo-checkbox-wrapper:hover > .condo-checkbox > .condo-checkbox-inner {
   border-color: #707695;
 }
-.condo-checkbox-wrapper:hover > .condo-checkbox::after {
-  visibility: visible;
+.condo-checkbox-wrapper:hover > .condo-checkbox-checked > .condo-checkbox-inner::before {
+  border-radius: 3px;
+}
+.condo-checkbox-wrapper .condo-checkbox-indeterminate > .condo-checkbox-input:focus + .condo-checkbox-inner::before {
+  position: absolute;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg, #e2ffeb 0%, #e7f4ff 100%) border-box;
+  border-radius: 3px;
+  content: "";
 }
 .condo-checkbox-wrapper:hover > .condo-checkbox-checked > .condo-checkbox-inner {
   background: linear-gradient(90deg, #4cd174 0%, #6db8f2 100%) border-box;
   border-color: transparent;
 }
-.condo-checkbox-wrapper:hover > .condo-checkbox-checked > .condo-checkbox-inner::before {
-  border-radius: 3px;
-}
 .condo-checkbox-wrapper:hover > .condo-checkbox-disabled > .condo-checkbox-inner {
   background: #f2f4f6 border-box;
   border-color: transparent;
 }
+.condo-checkbox-wrapper .condo-checkbox-checked > .condo-checkbox-input:focus + .condo-checkbox-inner {
+  background: linear-gradient(90deg, #4cd174 0%, #6db8f2 100%) border-box;
+  border-color: transparent;
+}
+.condo-checkbox-wrapper .condo-checkbox-checked > .condo-checkbox-input:focus + .condo-checkbox-inner::before {
+  position: absolute;
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg, #e2ffeb 0%, #e7f4ff 100%) border-box;
+  border-radius: 3px;
+  content: "";
+}
+.condo-checkbox-wrapper:hover > .condo-checkbox::after {
+  visibility: visible;
+}
 
 /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
 /* stylelint-disable no-duplicate-selectors */
@@ -4401,7 +4422,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -4447,7 +4468,7 @@ span.condo-typography-ellipsis-single-line {
   align-items: center;
   justify-content: space-between;
   padding: 12px 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
 }
 .condo-list-item-meta {
   display: flex;
@@ -4461,16 +4482,16 @@ span.condo-typography-ellipsis-single-line {
 .condo-list-item-meta-content {
   flex: 1 0;
   width: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
 }
 .condo-list-item-meta-title {
   margin-bottom: 4px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   line-height: 1.5715;
 }
 .condo-list-item-meta-title > a {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   transition: all 0.3s;
 }
 .condo-list-item-meta-title > a:hover {
@@ -4565,7 +4586,7 @@ span.condo-typography-ellipsis-single-line {
 }
 .condo-list-vertical .condo-list-item-meta-title {
   margin-bottom: 12px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 16px;
   line-height: 24px;
 }
@@ -4743,7 +4764,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -4765,7 +4786,7 @@ span.condo-typography-ellipsis-single-line {
 .condo-tag,
 .condo-tag a,
 .condo-tag a:hover {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
 }
 .condo-tag > a:first-child:last-child {
   display: inline-block;
@@ -4780,7 +4801,7 @@ span.condo-typography-ellipsis-single-line {
   transition: all 0.3s;
 }
 .condo-tag-close-icon:hover {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
 }
 .condo-tag-has-color {
   border-color: transparent;
@@ -5249,7 +5270,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -5301,7 +5322,7 @@ span.condo-typography-ellipsis-single-line {
 }
 .condo-modal-title {
   margin: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: 500;
   font-size: 16px;
   line-height: 22px;
@@ -5350,7 +5371,7 @@ span.condo-typography-ellipsis-single-line {
 }
 .condo-modal-header {
   padding: 16px 24px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   background: #fff;
   border-bottom: 1px solid #f0f0f0;
   border-radius: 2px 2px 0 0;
@@ -5419,14 +5440,14 @@ span.condo-typography-ellipsis-single-line {
 .condo-modal-confirm-body .condo-modal-confirm-title {
   display: block;
   overflow: hidden;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: 500;
   font-size: 16px;
   line-height: 1.4;
 }
 .condo-modal-confirm-body .condo-modal-confirm-content {
   margin-top: 8px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
 }
 .condo-modal-confirm-body > .anticon {
@@ -5550,8 +5571,8 @@ span.condo-typography-ellipsis-single-line {
   width: -moz-fit-content;
   width: fit-content;
   min-width: 100%;
-  overflow: hidden;
   padding: 1px;
+  overflow: hidden;
 }
 .condo-modal-root .condo-modal .condo-modal-footer {
   padding: 19px 40px 20px;
@@ -5566,11 +5587,11 @@ span.condo-typography-ellipsis-single-line {
   }
   .condo-modal-root .condo-modal {
     position: absolute;
-    left: 0;
-    right: 0;
-    bottom: 0;
     top: auto;
     top: initial;
+    right: 0;
+    bottom: 0;
+    left: 0;
     max-width: 100%;
     margin: 16px;
   }
@@ -5978,7 +5999,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -6154,7 +6175,7 @@ span.condo-typography-ellipsis-single-line {
 .condo-select-dropdown {
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-variant: tabular-nums;
   line-height: 1.5715;
   list-style: none;
@@ -6202,7 +6223,7 @@ span.condo-typography-ellipsis-single-line {
   display: block;
   min-height: 32px;
   padding: 5px 12px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: normal;
   font-size: 14px;
   line-height: 22px;
@@ -6213,7 +6234,7 @@ span.condo-typography-ellipsis-single-line {
   display: block;
   min-height: 32px;
   padding: 5px 12px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: normal;
   font-size: 14px;
   line-height: 22px;
@@ -6241,7 +6262,7 @@ span.condo-typography-ellipsis-single-line {
   background-color: #f5f5f5;
 }
 .condo-select-item-option-selected:not(.condo-select-item-option-disabled) {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: 600;
   background-color: #e6f7ff;
 }
@@ -6373,12 +6394,13 @@ span.condo-typography-ellipsis-single-line {
   padding-right: 0;
   padding-left: 21px;
 }
+.condo-select-dropdown .condo-select-item-empty .condo-typography {
+  margin-left: 8px;
+  color: #707695;
+}
 .condo-select {
   align-items: center;
 }
-.condo-select:hover .condo-select-clear {
-  opacity: 1;
-}
 .condo-select-fit-content {
   max-width: 100%;
 }
@@ -6401,9 +6423,6 @@ span.condo-typography-ellipsis-single-line {
 .condo-select-clear {
   background-color: #fff;
 }
-.condo-select-disabled:not(.condo-select-customize-input) .condo-select-arrow {
-  color: #e1e5ed;
-}
 .condo-select-open .condo-select-arrow {
   transform: translateY(-50%) rotate(180deg);
 }
@@ -6475,86 +6494,25 @@ span.condo-typography-ellipsis-single-line {
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector {
-  height: inherit;
-  min-height: 48px;
-  padding-top: calc(4px - 1px);
-  padding-bottom: calc(4px - 1px);
-}
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  width: inherit;
-  height: 32px;
-  margin: 4px 8px 4px 0;
-  padding: 0 8px;
-  background-color: #f2f4f6;
-  border: none;
-  border-radius: 4px;
-}
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-select-selection-item-content {
-  display: inline-flex;
-}
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-select-selection-item-remove {
-  display: flex;
-  align-items: center;
-  color: #222;
-}
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-typography {
-  margin: 0;
-  font-weight: 400;
-  font-size: 14px;
-  font-family: "Open Sans", var(--condo-font-fallback);
-  line-height: 22px;
-  letter-spacing: -0.01em;
-  overflow: hidden;
-  color: #222;
-  white-space: pre;
-  text-overflow: ellipsis;
-}
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-overflow-item-suffix {
-  display: flex;
-  align-items: center;
-  height: 40px;
-}
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder {
-  left: 12px;
-  display: inline-block;
-}
-.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-mirror {
-  margin: 0;
-  font-weight: 400;
-  font-size: 16px;
-  font-family: "Open Sans", var(--condo-font-fallback);
-  line-height: 24px;
-  letter-spacing: -0.01em;
-}
-.condo-select:not(.condo-select-disabled):hover .condo-select-selector {
-  border-color: transparent;
-}
-.condo-select:not(.condo-select-disabled):hover:not(.condo-select-success):not(.condo-select-warning):not(.condo-select-secondary):not(.condo-select-danger):not(.condo-select-info) .condo-select-selector {
-  border-color: #707695;
-}
 .condo-select-danger:not(.condo-select-customize-input) .condo-select-selector {
-  border-color: transparent;
   background: #ff3b30;
+  border-color: transparent;
 }
 .condo-select-success:not(.condo-select-customize-input) .condo-select-selector {
-  border-color: transparent;
   background: #39ce66;
+  border-color: transparent;
 }
 .condo-select-warning:not(.condo-select-customize-input) .condo-select-selector {
-  border-color: transparent;
   background: #ff9500;
+  border-color: transparent;
 }
 .condo-select-info:not(.condo-select-customize-input) .condo-select-selector {
-  border-color: transparent;
   background: #2696f3;
+  border-color: transparent;
 }
 .condo-select-secondary:not(.condo-select-customize-input) .condo-select-selector {
-  border-color: transparent;
   background: #707695;
+  border-color: transparent;
 }
 .condo-select-danger .condo-select-arrow,
 .condo-select-warning .condo-select-arrow,
@@ -6568,6 +6526,9 @@ span.condo-typography-ellipsis-single-line {
 .condo-select-success .condo-select-clear {
   color: #fff;
 }
+.condo-select-disabled:not(.condo-select-customize-input) .condo-select-arrow {
+  color: #e1e5ed;
+}
 .condo-select-danger .condo-select-clear {
   background-color: #ff3b30;
 }
@@ -6605,6 +6566,67 @@ span.condo-typography-ellipsis-single-line {
 .condo-select-success:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item > * {
   color: #fff;
 }
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector {
+  height: inherit;
+  min-height: 48px;
+  padding-top: calc(4px - 1px);
+  padding-bottom: calc(4px - 1px);
+}
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  width: inherit;
+  height: 32px;
+  margin: 4px 8px 4px 0;
+  padding: 0 8px;
+  background-color: #f2f4f6;
+  border: none;
+  border-radius: 4px;
+}
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-select-selection-item-content {
+  display: inline-flex;
+}
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-select-selection-item-remove {
+  display: flex;
+  align-items: center;
+  color: #222;
+}
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-typography {
+  margin: 0;
+  font-weight: 400;
+  font-size: 14px;
+  font-family: "Open Sans", var(--condo-font-fallback);
+  line-height: 22px;
+  letter-spacing: -0.01em;
+  overflow: hidden;
+  color: #222;
+  white-space: pre;
+  text-overflow: ellipsis;
+}
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-overflow-item-suffix {
+  display: flex;
+  align-items: center;
+  height: 40px;
+}
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder {
+  left: 12px;
+  display: inline-block;
+}
+.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-mirror {
+  margin: 0;
+  font-weight: 400;
+  font-size: 16px;
+  font-family: "Open Sans", var(--condo-font-fallback);
+  line-height: 24px;
+  letter-spacing: -0.01em;
+}
+.condo-select:hover .condo-select-clear {
+  opacity: 1;
+}
+.condo-select:not(.condo-select-disabled):hover .condo-select-selector {
+  border-color: transparent;
+}
 .condo-select-disabled.condo-select:not(.condo-select-customize-input) .condo-select-selector,
 .condo-select-disabled.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector {
   background: #fff;
@@ -6648,10 +6670,6 @@ span.condo-typography-ellipsis-single-line {
   padding: 20px;
   color: #707695;
 }
-.condo-select-dropdown .condo-select-item-empty .condo-typography {
-  margin-left: 8px;
-  color: #707695;
-}
 .condo-select-dropdown .condo-select-item-option-state {
   display: flex;
   align-items: center;
@@ -7037,7 +7055,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -7073,7 +7091,7 @@ span.condo-typography-ellipsis-single-line {
   margin: 0;
   padding: 5px 12px;
   overflow: hidden;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-weight: normal;
   font-size: 14px;
   line-height: 22px;
@@ -7172,7 +7190,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -7311,7 +7329,7 @@ span.condo-typography-ellipsis-single-line {
   transition: all 0.3s;
 }
 .condo-tabs-tab-remove:hover {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
 }
 .condo-tabs-tab:hover {
   color: #222;
@@ -7429,7 +7447,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -7719,7 +7737,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -7738,7 +7756,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -7767,7 +7785,7 @@ span.condo-typography-ellipsis-single-line {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   font-variant: tabular-nums;
   line-height: 1.5715;
@@ -7886,7 +7904,7 @@ span.condo-radio + * {
   height: 32px;
   margin: 0;
   padding: 0 15px;
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
   font-size: 14px;
   line-height: 30px;
   background: #fff;
@@ -7897,7 +7915,7 @@ span.condo-radio + * {
   transition: color 0.3s, background 0.3s, border-color 0.3s, box-shadow 0.3s;
 }
 .condo-radio-button-wrapper a {
-  color: rgba(0, 0, 0, 0.85);
+  color: #222222;
 }
 .condo-radio-button-wrapper > .condo-radio-button {
   position: absolute;
@@ -8087,13 +8105,6 @@ span.condo-radio + * {
 .condo-radio-wrapper .condo-radio-input {
   margin: 0;
 }
-.condo-radio-wrapper .condo-radio-input:focus + .condo-radio-inner {
-  border: double 1px transparent;
-  background-image: linear-gradient(white, white), linear-gradient(90deg, #4cd174 0%, #6db8f2 100%);
-  background-origin: border-box;
-  background-clip: content-box, border-box;
-  box-shadow: none;
-}
 .condo-radio-wrapper .condo-radio-inner {
   box-sizing: content-box;
   border-color: #d0d3e5;
@@ -8116,13 +8127,6 @@ span.condo-radio + * {
   border-radius: 100%;
   transform: translate(-50%, -50%);
 }
-.condo-radio-wrapper .condo-radio-checked > .condo-radio-input:focus + .condo-radio-inner {
-  border: double 1px transparent;
-  background-image: linear-gradient(90deg, #e2ffeb 0%, #e7f4ff 100%), linear-gradient(90deg, #2abb56 0%, #3996dd 100%);
-  background-origin: border-box;
-  background-clip: content-box, border-box;
-  box-shadow: none;
-}
 .condo-radio-wrapper .condo-radio-disabled > .condo-radio-inner {
   background-color: #f2f4f6;
   border-color: #e1e5ed;
@@ -8131,16 +8135,30 @@ span.condo-radio + * {
   border-color: #707695;
 }
 .condo-radio-wrapper:hover > .condo-radio-checked > .condo-radio-inner {
-  border: double 1px transparent;
   background-image: linear-gradient(90deg, #e2ffeb 0%, #e7f4ff 100%), linear-gradient(90deg, #2abb56 0%, #3996dd 100%);
-  background-origin: border-box;
   background-clip: content-box, border-box;
+  background-origin: border-box;
+  border: double 1px transparent;
   box-shadow: none;
 }
 .condo-radio-wrapper:hover > .condo-radio-disabled > .condo-radio-inner {
   background: #f2f4f6 border-box;
   border-color: #d0d3e5;
 }
+.condo-radio-wrapper .condo-radio-input:focus + .condo-radio-inner {
+  background-image: linear-gradient(white, white), linear-gradient(90deg, #4cd174 0%, #6db8f2 100%);
+  background-clip: content-box, border-box;
+  background-origin: border-box;
+  border: double 1px transparent;
+  box-shadow: none;
+}
+.condo-radio-wrapper .condo-radio-checked > .condo-radio-input:focus + .condo-radio-inner {
+  background-image: linear-gradient(90deg, #e2ffeb 0%, #e7f4ff 100%), linear-gradient(90deg, #2abb56 0%, #3996dd 100%);
+  background-clip: content-box, border-box;
+  background-origin: border-box;
+  border: double 1px transparent;
+  box-shadow: none;
+}
 .condo-radio-group {
   display: flex;
   flex-direction: column;
@@ -8225,6 +8243,27 @@ span.condo-radio + * {
   position: fixed;
   z-index: 10;
 }
+.condo-affix-content-wrapper {
+  height: -webkit-fit-content !important;
+  height: -moz-fit-content !important;
+  height: fit-content !important;
+}
+.condo-affix-content-wrapper {
+  position: relative;
+  right: 16px;
+  box-sizing: border-box;
+  width: calc(100% + 16px * 2);
+  padding: 16px;
+  transition: box-shadow 0.15s ease-out;
+}
+@media screen and (min-width:  0px ) and (max-width:  767px ) {
+  .condo-affix-content-wrapper > .condo-space-item {
+    width: 100%;
+  }
+  .condo-affix-content-wrapper > .condo-space-item > * {
+    width: 100%;
+  }
+}
 .condo-affix {
   height: auto !important;
 }
@@ -8255,25 +8294,4 @@ span.condo-radio + * {
     bottom: 24px !important;
   }
 }
-.condo-affix-content-wrapper {
-  height: -webkit-fit-content !important;
-  height: -moz-fit-content !important;
-  height: fit-content !important;
-}
-.condo-affix-content-wrapper {
-  position: relative;
-  right: 16px;
-  box-sizing: border-box;
-  width: calc(100% + 16px * 2);
-  padding: 16px;
-  transition: box-shadow 0.15s ease-out;
-}
-@media screen and (min-width:  0px ) and (max-width:  767px ) {
-  .condo-affix-content-wrapper > .condo-space-item {
-    width: 100%;
-  }
-  .condo-affix-content-wrapper > .condo-space-item > * {
-    width: 100%;
-  }
-}