ng-devui/devui.css

DevUI components based on Angular

@charset "UTF-8";
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
  margin: 20px 0;
  border: 0;
  border-top: 1px solid  #dbdbdb;
  border-top: 1px solid var(--devui-line, #dbdbdb);
}

pre {
  font-family: monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

b,
strong {
  font-weight: bold;
}

code,
kbd,
samp {
  font-family: monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.5;
  margin: 0;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

summary {
  display: list-item;
}

template {
  display: none;
}

[hidden] {
  display: none;
}

.devui-font-size-base {
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
}

.devui-font-base {
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
  font-weight:  normal;
  font-weight: var(--devui-font-content-weight, normal);
  line-height:  1.5;
  line-height: var(--devui-line-height-base, 1.5);
}

.devui-font-size-modal-title {
  font-size:  18px;
  font-size: var(--devui-font-size-modal-title, 18px);
}

.devui-font-modal-title {
  font-size:  18px;
  font-size: var(--devui-font-size-modal-title, 18px);
  font-weight:  bold;
  font-weight: var(--devui-font-title-weight, bold);
  line-height:  1.5;
  line-height: var(--devui-line-height-base, 1.5);
}

.devui-font-size-page-title {
  font-size:  16px;
  font-size: var(--devui-font-size-page-title, 16px);
}

.devui-font-page-title {
  font-size:  16px;
  font-size: var(--devui-font-size-page-title, 16px);
  font-weight:  bold;
  font-weight: var(--devui-font-title-weight, bold);
  line-height:  1.5;
  line-height: var(--devui-line-height-base, 1.5);
}

.devui-font-size-secondary-title {
  font-size:  14px;
  font-size: var(--devui-font-size-card-title, 14px);
}

.devui-font-secondary-title {
  font-size:  14px;
  font-size: var(--devui-font-size-card-title, 14px);
  font-weight:  bold;
  font-weight: var(--devui-font-title-weight, bold);
  line-height:  1.5;
  line-height: var(--devui-line-height-base, 1.5);
}

body {
  margin: 0;
  padding: 0;
  color:  #191919;
  color: var(--devui-text, #191919);
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
  font-family: "Helvetica", "Arial", "PingFangSC-Regular", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "HarmonyOS Sans SC", "HarmonyOS Sans", "Microsoft JhengHei";
  line-height:  1.5;
  line-height: var(--devui-line-height-base, 1.5);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

button {
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  outline: 0;
  -webkit-appearance: button;
}

button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: inherit;
}

ul,
ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

p {
  margin: 0;
  padding: 0;
}

a,
a:hover,
a:focus,
a:active,
a:visited {
  text-decoration: none;
}

:-ms-input-placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}

::-moz-placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}

::-webkit-input-placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}

.devui-scrollbar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.devui-scrollbar::-webkit-scrollbar-track {
  background-color: transparent;
}

.devui-scrollbar::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color:  #dbdbdb;
  background-color: var(--devui-line, #dbdbdb);
}

.devui-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color:  #808080;
  background-color: var(--devui-placeholder, #808080);
}

.devui-scroll-overlay {
  overflow: auto;
}
.devui-scroll-overlay::-webkit-scrollbar-thumb {
  background-color: transparent;
}
.devui-scroll-overlay:hover::-webkit-scrollbar-thumb {
  background-color:  #dbdbdb;
  background-color: var(--devui-line, #dbdbdb);
}
.devui-scroll-overlay:hover::-webkit-scrollbar-thumb:hover {
  background-color:  #808080;
  background-color: var(--devui-placeholder, #808080);
}

body > * ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

@-moz-document url-prefix() {
  body * {
    scrollbar-width: thin;
  }
  body * .devui-tbody-wrapper,
  body * .devui-year-list,
  body * .devui-canlender-panel-year-list,
  body * .devui-fix-header,
  body * .devui-month-list {
    scrollbar-width: none;
  }
  body * .devui-year-list:hover {
    scrollbar-width: thin;
  }
  body * .scroll-view.overflow-overlay {
    scrollbar-color: transparent transparent;
  }
  body * .scroll-view.overflow-overlay:hover {
    scrollbar-color:  #808080 transparent;
    scrollbar-color: var(--devui-placeholder, #808080) transparent;
  }
  body * .viewport-wrapper.overflow-overlay {
    scrollbar-color: transparent transparent;
  }
  body * .viewport-wrapper.overflow-overlay:hover {
    scrollbar-color:  #808080 transparent;
    scrollbar-color: var(--devui-placeholder, #808080) transparent;
  }
  body * .devui-scroll-overlay {
    scrollbar-color: transparent transparent;
  }
  body * .devui-scroll-overlay:hover {
    scrollbar-color:  #dbdbdb transparent;
    scrollbar-color: var(--devui-line, #dbdbdb) transparent;
  }
  body * .drawer-content {
    scrollbar-color: transparent transparent;
  }
  body * .drawer-content:hover {
    scrollbar-color:  #808080 transparent;
    scrollbar-color: var(--devui-placeholder, #808080) transparent;
  }
}
body > * ::-webkit-scrollbar-track {
  background-color: transparent;
}

body *::-moz-scrollbar-track {
  background-color: transparent;
}

body > * ::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color:  #dbdbdb;
  background-color: var(--devui-line, #dbdbdb);
}

body > * ::-webkit-scrollbar-thumb:hover {
  background-color:  #808080;
  background-color: var(--devui-placeholder, #808080);
}

body > * ::-webkit-scrollbar-corner {
  background-color: transparent;
}

.over-flow-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.over-flow-ellipsis-multi-row {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.clear-fix {
  zoom: 1;
}

.clear-fix::after {
  content: "";
  display: block;
  width: 0;
  clear: both;
}

.devui-close {
  float: right;
  font-weight: bold;
  line-height: 20px;
  height: 20px;
  color:  #191919;
  color: var(--devui-text, #191919);
  text-shadow: 0 1px 0 #ffffff;
  filter: alpha(opacity=20);
  opacity: 0.2;
}
.devui-close:hover, .devui-close:focus {
  color:  #191919;
  color: var(--devui-text, #191919);
  text-decoration: none;
  cursor: pointer;
  filter: alpha(opacity=50);
  opacity: 0.5;
}

button.devui-close {
  -webkit-appearance: none;
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
}

a:hover,
a:focus {
  color:  #0950de;
  color: var(--devui-link, #0950de);
}

a:active,
a:hover {
  outline: 0;
}

.devui-link {
  color:  #0950de;
  color: var(--devui-link, #0950de);
}
.devui-link:hover {
  color:  #0950de;
  color: var(--devui-link, #0950de);
  text-decoration: underline;
  cursor: pointer;
}

.devui-link-light {
  color:  #6b9bfa;
  color: var(--devui-link-light, #6b9bfa);
}
.devui-link-light:hover {
  color:  #6b9bfa;
  color: var(--devui-link-light, #6b9bfa);
  text-decoration: underline;
  cursor: pointer;
}

.devui-disabled, .devui-disabled.devui-input-group-addon {
  border-color:  #e6e6e6;
  border-color: var(--devui-disabled-line, #e6e6e6);
}
.devui-disabled, .devui-disabled > input, .devui-disabled > .devui-input-group-addon {
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
  background-color:  #f3f3f3;
  background-color: var(--devui-disabled-bg, #f3f3f3);
  cursor: not-allowed;
}

.devui-body-scrollblock {
  width: 100%;
}

.devui-body-overflow-hidden {
  overflow: hidden;
}

.devui-data-table .devui-table-title {
  font-weight: bold;
}
.devui-data-table .devui-table-link:hover {
  text-decoration: underline;
  cursor: pointer;
  color:  #0950de;
  color: var(--devui-link, #0950de);
}
.devui-data-table .devui-table-link a {
  color: inherit;
}

.devui-design-no-data {
  display: flex;
  height: calc(100vh - 523px);
  margin-top: 20px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

[dShapeIconHoverable].devui-shape-icon {
  color:  #c2c2c2;
  color: var(--devui-shape-icon-fill, #c2c2c2);
}
[dShapeIconHoverable].devui-shape-icon:hover {
  color:  #808080;
  color: var(--devui-shape-icon-fill-hover, #808080);
}

.devui-dropdown {
  position: relative;
  vertical-align: middle;
}
.devui-dropdown .devui-dropdown-toggle {
  box-shadow: none;
  outline: none;
}
.devui-dropdown .devui-dropdown-toggle.devui-dropdown-default {
  line-height: 1.5;
  padding: 4px 10px;
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  text-align: center;
  cursor: pointer;
  outline: 0;
  border-style: solid;
  border-width: 1px;
  display: flex;
  align-items: center;
}
.devui-dropdown .devui-dropdown-toggle.devui-dropdown-default:not(.devui-dropdown-item) {
  display: inline-flex !important;
}
.devui-dropdown .devui-caret {
  display: inline-block;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.devui-dropdown.devui-dropdown-open .devui-dropdown-toggle span.icon-chevron-down, .devui-dropdown.devui-dropdown-open .devui-dropdown-toggle span.icon-chevron-down-2 {
  transform: rotate(180deg);
}

.devui-dropdown-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  z-index:  1052;
  z-index: var(--devui-z-index-dropdown, 1052);
  min-width: min(100%, 102px);
  margin: 4px 0;
  background-clip: padding-box;
  background-color:  #ffffff;
  background-color: var(--devui-connected-overlay-bg, #ffffff);
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  box-shadow:  0 4px 12px 0  rgba(0, 0, 0, 0.16);
  box-shadow: var(--devui-shadow-length-connected-overlay, 0 4px 12px 0) var(--devui-shadow, rgba(0, 0, 0, 0.16));
  list-style: none;
  outline: none;
}
.devui-dropdown-menu.devui-scrollbar,
.devui-dropdown-menu .devui-scrollbar {
  overflow-x: visible;
  overflow-y: auto;
  overflow-y: overlay;
}
.open > .devui-dropdown-menu {
  display: block;
}
.devui-dropdown-menu > li {
  position: relative;
}
.devui-dropdown-menu > li > a {
  height: 36px;
  padding: 8px 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
}
.devui-dropdown-menu li > input {
  margin: 0 8px;
}
.devui-dropdown-menu > .disabled > a {
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
  cursor: not-allowed;
}
.devui-dropdown-menu > .disabled > a:hover, .devui-dropdown-menu > .disabled > a:focus {
  cursor: not-allowed;
}
.devui-dropdown-menu .devui-dropdown-item {
  cursor: pointer;
  display: block;
  width: 100%;
  min-height: 36px;
  line-height: 20px;
  padding: 8px 12px;
  border: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  transition: color  100ms  cubic-bezier(0.645, 0.045, 0.355, 1), background-color  100ms  cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: color var(--devui-animation-duration-fast, 100ms) var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1)), background-color var(--devui-animation-duration-fast, 100ms) var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1));
}
.devui-dropdown-menu .devui-dropdown-item:not(:first-child) {
  margin-top: 4px;
}
.devui-dropdown-menu .devui-dropdown-item.disabled {
  cursor: not-allowed;
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
}
.devui-dropdown-menu .devui-dropdown-item:not(.disabled):hover:not(.selected):not(.active) {
  background-color:  #f2f2f3;
  background-color: var(--devui-list-item-hover-bg, #f2f2f3);
  color:  #000000;
  color: var(--devui-list-item-hover-text, #000000);
}
.devui-dropdown-menu .devui-dropdown-item:not(.disabled).devui-dropdown-bg {
  background-color:  #f2f2f3;
  background-color: var(--devui-list-item-hover-bg, #f2f2f3);
  color:  #000000;
  color: var(--devui-list-item-hover-text, #000000);
}
.devui-dropdown-menu .devui-dropdown-item:not(.disabled).selected, .devui-dropdown-menu .devui-dropdown-item:not(.disabled).active {
  color:  #000000;
  color: var(--devui-list-item-active-text, #000000);
  background-color:  #cedefd;
  background-color: var(--devui-list-item-active-bg, #cedefd);
}
.devui-dropdown-menu .devui-dropdown-item:not(.disabled).selected:hover, .devui-dropdown-menu .devui-dropdown-item:not(.disabled).active:hover {
  background-color:  #cedefd;
  background-color: var(--devui-list-item-active-bg, #cedefd);
  color:  #000000;
  color: var(--devui-list-item-active-text, #000000);
}
.devui-dropdown-menu .devui-no-data-tip {
  cursor: not-allowed;
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
  background:  #ffffff;
  background: var(--devui-base-bg, #ffffff);
  line-height: 22px;
  padding: 0;
  text-align: center;
  user-select: none;
}

.devui-dropdown-menu-wrap .devui-no-data-tip {
  cursor: not-allowed;
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
  background:  #ffffff;
  background: var(--devui-base-bg, #ffffff);
  line-height: 22px;
  padding: 0;
  text-align: center;
  user-select: none;
}

.devui-form-group.devui-has-feedback > .devui-form-control-feedback {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: block;
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  pointer-events: none;
}
.devui-form-group.devui-has-feedback > .devui-form-control-feedback:hover {
  position: absolute;
}
.devui-form-group.devui-has-feedback > .devui-form-control-feedback .devui-caret {
  display: inline-block;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px solid;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

.form-group.has-feedback[tabindex] {
  outline: 0;
}

.devui-dropdown-no-border {
  min-height: 28px;
  min-width: min(100%, 102px);
  line-height: 1.5;
  padding: 4px 10px;
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  text-align: center;
  outline: 0;
  background-image: none;
  text-decoration: none;
  cursor: pointer;
  color:  #191919;
  color: var(--devui-text, #191919);
  display: flex;
  align-items: center;
  box-shadow: none;
  border: none;
}
.devui-dropdown-no-border:hover, .devui-dropdown-no-border:focus {
  text-decoration: none;
}
.devui-dropdown-no-border:active:hover, .devui-dropdown-no-border:focus {
  color:  #0950de;
  color: var(--devui-brand-active, #0950de);
}

.devui-dropdown .devui-dropdown-default {
  background-color:  #ffffff;
  background-color: var(--devui-base-bg, #ffffff);
  color:  #191919;
  color: var(--devui-text, #191919);
  border-color:  #dbdbdb;
  border-color: var(--devui-form-control-line, #dbdbdb);
}
.devui-dropdown .devui-dropdown-default:active, .devui-dropdown .devui-dropdown-default:focus, .devui-dropdown .devui-dropdown-default:hover {
  border-color:  #808080;
  border-color: var(--devui-form-control-line-hover, #808080);
}
.devui-dropdown .devui-dropdown-menu {
  background:  #ffffff;
  background: var(--devui-connected-overlay-bg, #ffffff);
  box-shadow:  0 4px 12px 0  rgba(0, 0, 0, 0.16);
  box-shadow: var(--devui-shadow-length-connected-overlay, 0 4px 12px 0) var(--devui-shadow, rgba(0, 0, 0, 0.16));
}
.devui-dropdown .devui-dropdown-menu > li > a:not(.disabled) {
  color:  #191919;
  color: var(--devui-text, #191919);
}
.devui-dropdown .devui-dropdown-menu > li > a:not(.disabled):hover, .devui-dropdown .devui-dropdown-menu > li > a:not(.disabled):focus {
  background-color:  #f2f2f3;
  background-color: var(--devui-list-item-hover-bg, #f2f2f3);
}
.devui-dropdown .devui-dropdown-menu > .disabled > a {
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
  cursor: not-allowed;
}
.devui-dropdown .devui-dropdown-menu > .disabled > a:hover, .devui-dropdown .devui-dropdown-menu > .disabled > a:focus {
  background-color: transparent;
}

.devui-image-preview-container img {
  cursor: zoom-in;
}

.devui-form-controls input[type=text],
.devui-form-controls input[type=password],
[dTextInput] {
  width: 100%;
  height: 28px;
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
  text-overflow: ellipsis;
}
.devui-form-controls input[type=text].devui-textinput-sm,
.devui-form-controls input[type=password].devui-textinput-sm,
[dTextInput].devui-textinput-sm {
  font-size:  12px;
  font-size: var(--devui-font-size-sm, 12px);
  height: 26px;
}
.devui-form-controls input[type=text].devui-textinput-lg,
.devui-form-controls input[type=password].devui-textinput-lg,
[dTextInput].devui-textinput-lg {
  font-size:  14px;
  font-size: var(--devui-font-size-lg, 14px);
  height: 46px;
}

[dTextArea] {
  width: 100%;
  max-width: 100%;
  min-width: 36px;
  min-height: 28px;
}

d-search.devui-glow-style .devui-input,
d-cascader.devui-glow-style .devui-input:not(.inner-input),
d-cascader.devui-glow-style .devui-tags-input-wrapper,
d-editable-select.devui-glow-style .devui-form-control,
d-input-number.devui-glow-style .devui-input,
d-multi-auto-complete.devui-glow-style .devui-dropdown-origin,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-input,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-select-list-wrapper,
d-tree-select.devui-glow-style .devui-form-control,
d-datepicker-pro.devui-glow-style .devui-single-picker,
d-range-datepicker-pro.devui-glow-style .devui-range-picker,
d-category-search.devui-glow-style .devui-category-search-container,
d-single-upload.devui-glow-style .devui-input-group,
d-multiple-upload.devui-glow-style .devui-input-group,
.devui-active-form {
  box-shadow: 0 0 0 0  rgba(94, 124, 224, 0.08);
  box-shadow: 0 0 0 0 var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
}
d-search.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-cascader.devui-glow-style .devui-input:not(.inner-input):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-cascader.devui-glow-style .devui-tags-input-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-editable-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-input-number.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-multi-auto-complete.devui-glow-style .devui-dropdown-origin:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-select-list-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-tree-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-datepicker-pro.devui-glow-style .devui-single-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-range-datepicker-pro.devui-glow-style .devui-range-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-category-search.devui-glow-style .devui-category-search-container:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-single-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
d-multiple-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
.devui-active-form:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover {
  box-shadow: 0 0 0 4px  rgba(94, 124, 224, 0.08);
  box-shadow: 0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
}
d-search.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-cascader.devui-glow-style .devui-input:not(.inner-input):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-cascader.devui-glow-style .devui-tags-input-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-editable-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-input-number.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-multi-auto-complete.devui-glow-style .devui-dropdown-origin:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-select-list-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-tree-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-datepicker-pro.devui-glow-style .devui-single-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-range-datepicker-pro.devui-glow-style .devui-range-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-category-search.devui-glow-style .devui-category-search-container:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-single-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
d-multiple-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
.devui-active-form:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus {
  box-shadow: 0 0 0 4px  rgba(94, 124, 224, 0.08);
  box-shadow: 0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
}
d-search.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-cascader.devui-glow-style .devui-input:not(.inner-input):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-cascader.devui-glow-style .devui-tags-input-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-editable-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-input-number.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-multi-auto-complete.devui-glow-style .devui-dropdown-origin:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-select-list-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-tree-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-datepicker-pro.devui-glow-style .devui-single-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-range-datepicker-pro.devui-glow-style .devui-range-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-category-search.devui-glow-style .devui-category-search-container:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-single-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
d-multiple-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within,
.devui-active-form:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus-within {
  box-shadow: 0 0 0 4px  rgba(94, 124, 224, 0.08);
  box-shadow: 0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
}
d-search.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-cascader.devui-glow-style .devui-input:not(.inner-input):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-cascader.devui-glow-style .devui-tags-input-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-editable-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-input-number.devui-glow-style .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-multi-auto-complete.devui-glow-style .devui-dropdown-origin:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-input:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-select.devui-glow-style .devui-dropdown-origin:not(.devui-select-underlined-border):not(.devui-gray-style) .devui-select-list-wrapper:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-tree-select.devui-glow-style .devui-form-control:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-datepicker-pro.devui-glow-style .devui-single-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-range-datepicker-pro.devui-glow-style .devui-range-picker:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-category-search.devui-glow-style .devui-category-search-container:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-single-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
d-multiple-upload.devui-glow-style .devui-input-group:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active,
.devui-active-form:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):active {
  box-shadow: none;
}

.devui-form-controls textarea,
[dTextInput],
[dTextarea] {
  box-sizing: border-box;
  padding: 4px 8px;
  color:  #191919;
  color: var(--devui-text, #191919);
  vertical-align: middle;
  border: 1px solid  #dbdbdb;
  border: 1px solid var(--devui-form-control-line, #dbdbdb);
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  outline: none;
  background-color:  #ffffff;
  background-color: var(--devui-form-control-bg, #ffffff);
  box-shadow: 0 0 0 0  rgba(94, 124, 224, 0.08);
  box-shadow: 0 0 0 0 var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
  transition: border-color 300ms  cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow  200ms  cubic-bezier(0.5, 0, 0.84, 0.25);
  transition: border-color 300ms var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1)), box-shadow var(--devui-animation-duration-base, 200ms) var(--devui-animation-ease-in, cubic-bezier(0.5, 0, 0.84, 0.25));
}
.devui-form-controls textarea.devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):hover,
[dTextInput].devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):hover,
[dTextarea].devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):hover {
  box-shadow: 0 0 0 4px  rgba(94, 124, 224, 0.08);
  box-shadow: 0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
}
.devui-form-controls textarea.devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):focus,
[dTextInput].devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):focus,
[dTextarea].devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):focus {
  border-color:  #0a59f7;
  border-color: var(--devui-form-control-line-active, #0a59f7);
  box-shadow: 0 0 0 4px  rgba(94, 124, 224, 0.08);
  box-shadow: 0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, 0.08));
}
.devui-form-controls textarea.devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):active,
[dTextInput].devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):active,
[dTextarea].devui-glow-style:not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):not(.inner-input):active {
  box-shadow: none;
}
.devui-form-controls textarea:not(.devui-glow-style):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
[dTextInput]:not(.devui-glow-style):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover,
[dTextarea]:not(.devui-glow-style):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):hover {
  border-color:  #808080;
  border-color: var(--devui-form-control-line-hover, #808080);
}
.devui-form-controls textarea:not(.devui-glow-style):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
[dTextInput]:not(.devui-glow-style):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus,
[dTextarea]:not(.devui-glow-style):not([disabled]):not(.disabled):not(.devui-disabled):not(.error):not(.devui-error):focus {
  border-color:  #0a59f7;
  border-color: var(--devui-form-control-line-active, #0a59f7);
}
.devui-form-controls textarea[disabled], .devui-form-controls textarea[disabled]:hover, .devui-form-controls textarea.disabled, .devui-form-controls textarea.disabled:hover, .devui-form-controls textarea.devui-disabled, .devui-form-controls textarea.devui-disabled:hover,
[dTextInput][disabled],
[dTextInput][disabled]:hover,
[dTextInput].disabled,
[dTextInput].disabled:hover,
[dTextInput].devui-disabled,
[dTextInput].devui-disabled:hover,
[dTextarea][disabled],
[dTextarea][disabled]:hover,
[dTextarea].disabled,
[dTextarea].disabled:hover,
[dTextarea].devui-disabled,
[dTextarea].devui-disabled:hover {
  cursor: not-allowed;
  background-color:  #f3f3f3;
  background-color: var(--devui-disabled-bg, #f3f3f3);
  border-color:  #e6e6e6;
  border-color: var(--devui-disabled-line, #e6e6e6);
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
}
.devui-form-controls textarea::placeholder,
[dTextInput]::placeholder,
[dTextarea]::placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}
.devui-form-controls textarea:focus:placeholder-shown::placeholder,
[dTextInput]:focus:placeholder-shown::placeholder,
[dTextarea]:focus:placeholder-shown::placeholder {
  color: transparent;
  transition: all  300ms  cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all var(--devui-animation-duration-slow, 300ms) var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1));
}

.devui-form-controls textarea,
[dTextarea] {
  width: 100%;
}
.devui-form-controls textarea + .devui-textarea-counter,
[dTextarea] + .devui-textarea-counter {
  float: left;
  display: block;
  position: relative;
  pointer-events: none;
  overflow: visible;
  color:  #595959;
  color: var(--devui-aide-text, #595959);
  font-size:  12px;
  font-size: var(--devui-font-size-sm, 12px);
  width: 0 !important;
}
.devui-form-controls textarea + .devui-textarea-counter > i,
[dTextarea] + .devui-textarea-counter > i {
  display: block;
  font-style: normal;
  white-space: nowrap;
  text-align: right;
  position: relative;
  right: 10px;
  bottom: 7px;
}

.devui-input-group {
  position: relative;
  display: table;
  border-collapse: separate;
}

.devui-input-group-addon {
  border: 1px solid  #dbdbdb;
  border: 1px solid var(--devui-form-control-line, #dbdbdb);
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  display: table-cell;
  padding: 0 8px;
  text-align: center;
}
.devui-input-group-addon:last-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 0;
}
.devui-input-group-addon:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
}

.devui-input {
  outline: none;
  background-color:  #ffffff;
  background-color: var(--devui-form-control-bg, #ffffff);
  border: 1px solid  #dbdbdb;
  border: 1px solid var(--devui-form-control-line, #dbdbdb);
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  padding: 4px 8px;
  line-height: 18px;
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
  color:  #191919;
  color: var(--devui-text, #191919);
  width: 100%;
  display: block;
  cursor: text;
  height: 28px;
  transition: border-color 300ms  cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow  200ms  cubic-bezier(0.5, 0, 0.84, 0.25);
  transition: border-color 300ms var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1)), box-shadow var(--devui-animation-duration-base, 200ms) var(--devui-animation-ease-in, cubic-bezier(0.5, 0, 0.84, 0.25));
}
.devui-input:focus {
  border-color:  #0a59f7;
  border-color: var(--devui-form-control-line-active, #0a59f7);
}
.devui-input[disabled], .devui-input[disabled]:hover, .devui-input[disabled]:focus, .devui-input[disabled]:hover:focus, .devui-input.disabled, .devui-input.disabled:hover, .devui-input.disabled:focus, .devui-input.disabled:hover:focus, .devui-input.devui-disabled, .devui-input.devui-disabled:hover, .devui-input.devui-disabled:focus, .devui-input.devui-disabled:hover:focus {
  border-color:  #e6e6e6;
  border-color: var(--devui-disabled-line, #e6e6e6);
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
  background-color:  #f3f3f3;
  background-color: var(--devui-disabled-bg, #f3f3f3);
  cursor: not-allowed;
}
.devui-input::placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}
.devui-input.devui-search-in-dropdown {
  margin: 0;
  border: none;
  padding: 4px 28px 4px 8px;
  background-color:  #f2f2f3;
  background-color: var(--devui-embed-search-bg, #f2f2f3);
  color:  #191919;
  color: var(--devui-text, #191919);
}
.devui-input.devui-search-in-dropdown:-ms-input-placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}
.devui-input.devui-search-in-dropdown:hover {
  background-color:  #f5f5f5;
  background-color: var(--devui-embed-search-bg-hover, #f5f5f5);
}
.devui-input-group > .devui-input {
  display: table-cell;
}
.devui-input-group > .devui-input:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.devui-input-group > .devui-input:last-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.devui-input-group > .devui-input:not(:first-child):not(:last-child) {
  border-radius: 0;
}

.devui-input-lg {
  font-size:  16px;
  font-size: var(--devui-font-size-page-title, 16px);
  line-height: 20px;
  height: 32px;
}

.devui-input-sm {
  font-size:  12px;
  font-size: var(--devui-font-size, 12px);
  line-height: 14px;
  height: 26px;
}

.devui-dropup,
.devui-dropdown {
  position: relative;
}

.devui-form-group {
  position: relative;
}

.devui-form-control {
  color:  #191919;
  color: var(--devui-text, #191919);
  background-color:  #ffffff;
  background-color: var(--devui-form-control-bg, #ffffff);
  padding: 4px 8px;
  border: 1px solid  #dbdbdb;
  border: 1px solid var(--devui-form-control-line, #dbdbdb);
  display: block;
  width: 100%;
  height: 28px;
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  outline: 0;
  transition: border-color 300ms  cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow  200ms  cubic-bezier(0.5, 0, 0.84, 0.25);
  transition: border-color 300ms var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1)), box-shadow var(--devui-animation-duration-base, 200ms) var(--devui-animation-ease-in, cubic-bezier(0.5, 0, 0.84, 0.25));
}
.devui-form-control[disabled], .devui-form-control[disabled]:hover, .devui-form-control[disabled]:focus, .devui-form-control.disabled, .devui-form-control.disabled:hover, .devui-form-control.disabled:focus, .devui-form-control.devui-disabled, .devui-form-control.devui-disabled:hover, .devui-form-control.devui-disabled:focus {
  border-color:  #e6e6e6;
  border-color: var(--devui-disabled-line, #e6e6e6);
}
.devui-form-control[disabled], .devui-form-control[disabled] > input, .devui-form-control[disabled]:hover, .devui-form-control[disabled]:hover > input, .devui-form-control[disabled]:focus, .devui-form-control[disabled]:focus > input, .devui-form-control.disabled, .devui-form-control.disabled > input, .devui-form-control.disabled:hover, .devui-form-control.disabled:hover > input, .devui-form-control.disabled:focus, .devui-form-control.disabled:focus > input, .devui-form-control.devui-disabled, .devui-form-control.devui-disabled > input, .devui-form-control.devui-disabled:hover, .devui-form-control.devui-disabled:hover > input, .devui-form-control.devui-disabled:focus, .devui-form-control.devui-disabled:focus > input {
  color:  #c2c2c2;
  color: var(--devui-disabled-text, #c2c2c2);
  background-color:  #f3f3f3;
  background-color: var(--devui-disabled-bg, #f3f3f3);
  cursor: not-allowed;
}
.devui-form-control:focus {
  border-color:  #0a59f7;
  border-color: var(--devui-form-control-line-active, #0a59f7);
}

:not(.multiple-label-auto-complete-disabled):not(.devui-error) > .devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border) {
  border-color:  #dbdbdb;
  border-color: var(--devui-form-control-line, #dbdbdb);
  transition: border-color 300ms  cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow  200ms  cubic-bezier(0.5, 0, 0.84, 0.25);
  transition: border-color 300ms var(--devui-animation-ease-in-out-smooth, cubic-bezier(0.645, 0.045, 0.355, 1)), box-shadow var(--devui-animation-duration-base, 200ms) var(--devui-animation-ease-in, cubic-bezier(0.5, 0, 0.84, 0.25));
}
:not(.multiple-label-auto-complete-disabled):not(.devui-error) > .devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):focus, :not(.multiple-label-auto-complete-disabled):not(.devui-error) > .devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border):focus-within {
  outline: none;
  border-color:  #0a59f7;
  border-color: var(--devui-form-control-line-active, #0a59f7);
}
:not(.multiple-label-auto-complete-disabled):not(.devui-error) > .devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled):not(.devui-dropdown-no-border):not(.devui-no-border).devui-dropdown-origin-open {
  outline: none;
  border-color:  #0950de;
  border-color: var(--devui-connected-overlay-line, #0950de);
}

.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) {
  min-height: 28px;
}
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not([disabled]):not(.disabled):not(.devui-disabled) {
  color:  #191919;
  color: var(--devui-text, #191919);
}
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) > .devui-input, .devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) > .devui-form-control {
  height: 26px;
}
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]):not(.devui-select-underlined-border):not(.devui-dropdown-no-border):not(.devui-no-border) {
  border-radius:  2px;
  border-radius: var(--devui-border-radius, 2px);
  border-width: 1px;
  border-style: solid;
}
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:focus,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-form-control:focus:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) .devui-input-group-addon:focus,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) > .devui-dropdown-default,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) > .devui-dropdown-default:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) > .devui-dropdown-default:active,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]) > .devui-dropdown-default:focus {
  border-color: transparent;
}
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:focus,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-form-control:focus:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] .devui-input-group-addon,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] > .devui-dropdown-default,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] > .devui-dropdown-default:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] > .devui-dropdown-default:active,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-])[disabled] > .devui-dropdown-default:focus, .devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:focus,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-form-control:focus:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled .devui-input-group-addon,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled > .devui-dropdown-default,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled > .devui-dropdown-default:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled > .devui-dropdown-default:active,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).disabled > .devui-dropdown-default:focus, .devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:focus,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-form-control:focus:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled .devui-input-group-addon,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled > .devui-dropdown-default,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled > .devui-dropdown-default:hover,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled > .devui-dropdown-default:active,
.devui-dropdown-origin:not(d-button):not(.icon):not([class^=icon-]).devui-disabled > .devui-dropdown-default:focus {
  background-color:  #f3f3f3;
  background-color: var(--devui-disabled-bg, #f3f3f3);
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color:  #808080;
  color: var(--devui-placeholder, #808080);
}

/* status style start */
/* border color and background */
[dTextInput]:not([disabled]):not(.disabled):not(.devui-disabled).error,
[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).error,
[dTextInput]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error,
[dTextarea]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error {
  border-color:  #e02128;
  border-color: var(--devui-danger-line, #e02128);
  background-color:  #fabdc1;
  background-color: var(--devui-danger-bg, #fabdc1);
}

[dDatePicker]:not([disabled]):not(.disabled):not(.devui-disabled).devui-error {
  background-color:  #fabdc1;
  background-color: var(--devui-danger-bg, #fabdc1);
}

d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup,
d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown {
  border-color:  #e02128;
  border-color: var(--devui-danger-line, #e02128);
}
d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup .devui-form-group .devui-input.devui-form-control.devui-select-input:not(.devui-select-search),
d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup .devui-form-group .devui-select-input:not(.devui-select-search) + .devui-form-control-feedback,
d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropup .devui-form-group .devui-form-control.devui-select-list-wrapper,
d-select:not([disabled]):not(.disabled):not(.devui-disabled):not(.multiple-label-auto-complete-disabled).devui-error div.devui-dropdown-origin.devui-dropdown .devui-form-group .devui-input.devui-form-control.devui-select-input:not(.devui-select-search),
d-select:not([disabled]):not(.disabled):not(.devui-disabled)