@ng-select/ng-select/themes/ant.design.theme.css

Angular ng-select - All in One UI Select, Multiselect and Autocomplete

:root{--ng-select-highlight: #40a9ff;--ng-select-primary-text: rgba(0, 0, 0, 0.65);--ng-select-disabled-text: rgba(0, 0, 0, 0.25);--ng-select-disabled-bg: #f5f5f5;--ng-select-border: #d9d9d9;--ng-select-border-radius: 4px;--ng-select-bg: #ffffff;--ng-select-selected: rgba(24, 144, 255, 0.2);--ng-select-selected-bg: #fafafa;--ng-select-marked: #e6f7ff;--ng-select-placeholder: rgba(153, 153, 153, 0.65);--ng-select-border-lighter: rgb(242.5, 242.5, 242.5);--ng-select-value-bg: #fafafa;--ng-select-value-border: rgb(232.3, 232.3, 232.3);--ng-select-clear: #a6a6a6;--ng-select-clear-bg: rgba(0, 0, 0, 0.25);--ng-select-clear-bg-hover: rgba(0, 0, 0, 0.45);--ng-select-clear-icon: #fff;--ng-select-dropdown-optgroup-text: rgba(0, 0, 0, 0.45);--ng-select-dropdown-shadow: 0 2px 8px rgba(0, 0, 0, 0.15)}.ng-select{position:relative}.ng-select.ng-select-opened.ng-select-clearable .ng-select-container.ng-has-value:hover .ng-clear-wrapper{opacity:0;pointer-events:none}.ng-select.ng-select-opened.ng-select-clearable .ng-select-container.ng-has-value:hover .ng-arrow-wrapper{opacity:1;pointer-events:auto}.ng-select.ng-select-opened>.ng-select-container{background:var(--ng-select-bg, #ffffff);border-color:var(--ng-select-highlight, #40a9ff);box-shadow:0 0 0 2px var(--ng-select-selected, rgba(24, 144, 255, 0.2))}.ng-select.ng-select-opened>.ng-select-container .ng-arrow-wrapper{transform:rotate(180deg);opacity:1}[dir=rtl] .ng-select.ng-select-opened>.ng-select-container .ng-arrow-wrapper{transform:rotate(-180deg)}.ng-select.ng-select-focused .ng-select-container{border-color:var(--ng-select-highlight, #40a9ff)}.ng-select.ng-select-disabled>.ng-select-container{background-color:var(--ng-select-disabled-bg, #f5f5f5)}.ng-select.ng-select-disabled>.ng-select-container:hover{border:1px solid var(--ng-select-border, #d9d9d9);cursor:not-allowed}.ng-select.ng-select-disabled>.ng-select-container .ng-value-container .ng-value{color:var(--ng-select-disabled-text, rgba(0, 0, 0, 0.25))}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select.ng-select-clearable .ng-select-container.ng-has-value:hover .ng-clear-wrapper{opacity:1}.ng-select.ng-select-clearable .ng-select-container.ng-has-value:hover .ng-arrow-wrapper{opacity:0;pointer-events:none}.ng-select .ng-select-container{color:var(--ng-select-primary-text, rgba(0, 0, 0, 0.65));background-color:var(--ng-select-bg, #ffffff);border-radius:var(--ng-select-border-radius, 4px);border:1px solid var(--ng-select-border, #d9d9d9);min-height:30px;align-items:center;transition:all .3s;box-sizing:border-box;padding-right:11px;padding-left:11px}.ng-select .ng-select-container .ng-input{line-height:22px}.ng-select .ng-select-container .ng-input input{color:var(--ng-select-primary-text, rgba(0, 0, 0, 0.65))}.ng-select .ng-select-container .ng-value-container{align-items:center}.ng-select .ng-select-container .ng-value-container .ng-value{font-size:14px;color:var(--ng-select-primary-text, rgba(0, 0, 0, 0.65))}.ng-select .ng-select-container .ng-value-container .ng-placeholder{font-size:14px;color:var(--ng-select-placeholder, rgba(153, 153, 153, 0.65))}.ng-select.ng-select-single.ng-select-opened .ng-select-container .ng-value{opacity:.4}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:2px;left:0;padding-left:10px;padding-right:50px}[dir=rtl] .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{padding-right:10px;padding-left:50px}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value{background-color:var(--ng-select-disabled-bg, #f5f5f5)}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-label{padding:0 5px}.ng-select.ng-select-multiple .ng-select-container{min-height:32px;padding-left:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container{padding-right:5px;padding-left:11px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{margin-left:0;margin-right:6px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-bottom:3px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-top:3px;margin-right:4px;font-size:.9em;background-color:var(--ng-select-value-bg, #fafafa);border:1px solid var(--ng-select-value-border, rgb(232.3, 232.3, 232.3));border-radius:2px;height:24px;line-height:22px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:0;margin-left:4px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{background-color:var(--ng-select-disabled-bg, #f5f5f5);color:var(--ng-select-disabled-text, rgba(0, 0, 0, 0.25))}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:0;padding-right:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{display:inline-block;padding:0 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;padding:0 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{top:50%;height:20px;margin-top:-10px;margin-left:6px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{height:24px;margin-top:3px}.ng-select .ng-clear-wrapper{opacity:0;color:var(--ng-select-clear, #a6a6a6);background:var(--ng-select-clear-bg, rgba(0, 0, 0, 0.25));width:12px;height:12px;text-align:center;border-radius:12px;vertical-align:middle;transition:color .3s ease;position:absolute;right:13px}[dir=rtl] .ng-select .ng-clear-wrapper{left:13px;right:auto}.ng-select .ng-clear-wrapper:hover{background:var(--ng-select-clear-bg-hover, rgba(0, 0, 0, 0.45))}.ng-select .ng-clear-wrapper:focus{background:var(--ng-select-clear-bg-hover, rgba(0, 0, 0, 0.45));outline:none}.ng-select .ng-clear-wrapper .ng-clear{color:var(--ng-select-clear-icon, #fff);font-size:9px;position:absolute;left:3px;line-height:12px}.ng-select .ng-spinner-zone{padding:5px 5px 0 0}[dir=rtl] .ng-select .ng-spinner-zone{padding:5px 0 0 5px}.ng-select .ng-arrow-wrapper{width:16px;height:26px;transition:transform .3s}.ng-select .ng-arrow-wrapper .ng-arrow{border-style:solid;border-width:.1rem .1rem 0 0;height:8px;width:8px;top:-2px;transform:rotate(135deg);color:var(--ng-select-disabled-text, rgba(0, 0, 0, 0.25))}.ng-dropdown-panel{background-color:var(--ng-select-bg, #ffffff);box-shadow:var(--ng-select-dropdown-shadow, 0 2px 8px rgba(0, 0, 0, 0.15));border-radius:var(--ng-select-border-radius, 4px);margin-top:4px;margin-bottom:4px}.ng-dropdown-panel.ng-select-top{border-bottom-color:var(--ng-select-border-lighter, rgb(242.5, 242.5, 242.5))}.ng-dropdown-panel.ng-select-right{border-bottom-color:var(--ng-select-border-lighter, rgb(242.5, 242.5, 242.5));margin-top:0;margin-left:4px}.ng-dropdown-panel.ng-select-bottom{border-top-color:var(--ng-select-border-lighter, rgb(242.5, 242.5, 242.5))}.ng-dropdown-panel.ng-select-left{border-bottom-color:var(--ng-select-border-lighter, rgb(242.5, 242.5, 242.5));margin-top:0;margin-right:4px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid var(--ng-select-border, #d9d9d9);padding:5px 7px}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--ng-select-border, #d9d9d9);padding:5px 7px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{user-select:none;padding:4px 12px;color:var(--ng-select-dropdown-optgroup-text, rgba(0, 0, 0, 0.45));cursor:pointer}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default;color:var(--ng-select-dropdown-optgroup-text, rgba(0, 0, 0, 0.45))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:var(--ng-select-marked, #e6f7ff)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{background-color:var(--ng-select-selected-bg, #fafafa);font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected.ng-option-marked{background-color:var(--ng-select-marked, #e6f7ff)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:var(--ng-select-bg, #ffffff);color:var(--ng-select-primary-text, rgba(0, 0, 0, 0.65));padding:5px 12px;transition:background .3s ease}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option:first-child{border-top-right-radius:var(--ng-select-border-radius, 4px);border-top-left-radius:var(--ng-select-border-radius, 4px)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option:last-child{border-bottom-right-radius:var(--ng-select-border-radius, 4px);border-bottom-left-radius:var(--ng-select-border-radius, 4px)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background-color:var(--ng-select-selected-bg, #fafafa);font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{color:var(--ng-select-primary-text, rgba(0, 0, 0, 0.65));background-color:var(--ng-select-marked, #e6f7ff)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:var(--ng-select-marked, #e6f7ff);color:var(--ng-select-primary-text, rgba(0, 0, 0, 0.65))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:var(--ng-select-disabled-text, rgba(0, 0, 0, 0.25));cursor:not-allowed}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:20px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:20px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-option-label{font-size:14px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{font-size:80%;font-weight:400;padding-right:5px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{padding-left:5px;padding-right:0}[dir=rtl] .ng-dropdown-panel{direction:rtl;text-align:right}/*# sourceMappingURL=ant.design.theme.css.map */