"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const cssr_1 = require("../../../../_utils/cssr"); // vars:
// --bezier
// --border
// --border-active
// --border-focus
// --border-hover
// --border-radius
// --box-shadow-active
// --box-shadow-focus
// --box-shadow-hover
// --caret-color
// --color
// --color-active
// --color-disabled
// --font-size
// --height
// --padding-single
// --placeholder-color
// --placeholder-color-disabled
// --text-color
// --text-color-disabled
// --arrow-color
// --loading-color
// ...clear vars
// ...form item vars


exports.default = cssr_1.c([cssr_1.cB('base-selection', `
 position: relative;
 z-index: auto;
 box-shadow: none;
 width: 100%;
 max-width: 100%;
 display: inline-block;
 vertical-align: bottom;
 border-radius: var(--border-radius);
 min-height: var(--height);
 line-height: var(--height);
 font-size: var(--font-size);
 `, [cssr_1.cB('base-loading', `
 color: var(--loading-color);
 `), cssr_1.cB('base-selection-label', `
 height: var(--height);
 line-height: var(--height);
 `), cssr_1.cB('base-selection-tags', {
  minHeight: 'var(--height)'
}), cssr_1.cE('border, state-border', `
 position: absolute;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 pointer-events: none;
 border: var(--border);
 border-radius: inherit;
 transition:
 box-shadow .3s var(--bezier),
 border-color .3s var(--bezier);
 `), cssr_1.cE('state-border', `
 z-index: 1;
 border-color: #0000;
 `), cssr_1.cB('base-suffix', `
 cursor: pointer;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 right: 10px;
 `, [cssr_1.cE('arrow', `
 color: var(--arrow-color);
 transition: color .3s var(--bezier);
 `)]), cssr_1.cB('base-render-dom', `
 white-space: nowrap;
 overflow: hidden;
 height: var(--height);
 line-height: var(--height);
 pointer-events: none;
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 padding: var(--padding-single);
 transition: color .3s var(--bezier);
 `), cssr_1.cB('base-selection-placeholder', `
 color: var(--placeholder-color);
 `), cssr_1.cB('base-selection-tags', `
 cursor: pointer;
 outline: none;
 box-sizing: border-box;
 position: relative;
 z-index: auto;
 display: flex;
 padding: 3px 26px 0 14px;
 flex-wrap: wrap;
 align-items: center;
 width: 100%;
 vertical-align: bottom;
 background-color: var(--color);
 border-radius: inherit;
 transition:
 color .3s var(--bezier),
 box-shadow .3s var(--bezier),
 background-color .3s var(--bezier);
 `), cssr_1.cB('base-selection-label', `
 display: inline-block;
 width: 100%;
 vertical-align: bottom;
 cursor: pointer;
 outline: none;
 z-index: auto;
 box-sizing: border-box;
 position: relative;
 transition:
 color .3s var(--bezier),
 box-shadow .3s var(--bezier),
 background-color .3s var(--bezier);
 border-radius: inherit;
 background-color: var(--color);
 `, [cssr_1.cE('input', `
 line-height: inherit;
 outline: none;
 cursor: pointer;
 box-sizing: border-box;
 text-overflow: ellipsis;
 overflow: hidden;
 border:none;
 width: 100%;
 white-space: nowrap;
 padding: var(--padding-single);
 background-color: #0000;
 color: var(--text-color);
 transition: color .3s var(--bezier);
 caret-color: var(--caret-color);
 `), cssr_1.cE('render-label', `
 color: var(--text-color);
 `)]), cssr_1.cNotM('disabled', [cssr_1.c('&:hover', [cssr_1.cE('state-border', `
 box-shadow: var(--box-shadow-hover);
 border: var(--border-hover);
 `)]), cssr_1.cM('focus', [cssr_1.cE('state-border', `
 box-shadow: var(--box-shadow-focus);
 border: var(--border-focus);
 `)]), cssr_1.cM('active', [cssr_1.cE('state-border', `
 box-shadow: var(--box-shadow-active);
 border: var(--border-active);
 `), cssr_1.cB('base-selection-label', {
  backgroundColor: 'var(--color-active)'
}), cssr_1.cB('base-selection-tags', {
  backgroundColor: 'var(--color-active)'
})])]), cssr_1.cM('disabled', {
  cursor: 'not-allowed'
}, [cssr_1.cE('arrow', `
 color: var(--arrow-color-disabled);
 `), cssr_1.cB('base-selection-label', `
 cursor: not-allowed;
 background-color: var(--color-disabled);
 `, [cssr_1.cE('input', `
 cursor: not-allowed;
 color: var(--text-color-disabled);
 `), cssr_1.cE('render-label', `
 color: var(--text-color-disabled);
 `)]), cssr_1.cB('base-selection-tags', `
 cursor: not-allowed;
 background-color: var(--color-disabled);
 `), cssr_1.cB('base-selection-placeholder', `
 cursor: not-allowed;
 color: var(--placeholder-color-disabled);
 `)]), cssr_1.cB('base-selection-input-tag', `
 height: calc(var(--height) - 6px);
 line-height: calc(var(--height) - 6px);
 outline: none;
 display: none;
 position: relative;
 margin-bottom: 3px;
 max-width: 100%;
 vertical-align: bottom;
 `, [cssr_1.cE('input', `
 min-width: 1px;
 padding: 0;
 background-color: #0000;
 outline: none;
 border: none;
 max-width: 100%;
 overflow: hidden;
 width: 1em;
 line-height: inherit;
 cursor: pointer;
 color: var(--text-color);
 caret-color: var(--caret-color);
 `), cssr_1.cE('mirror', `
 position: absolute;
 left: 0;
 top: 0;
 white-space: pre;
 visibility: hidden;
 user-select: none;
 opacity: 0;
 `)])]), cssr_1.cB('base-selection-popover', `
 margin-bottom: -3px;
 display: flex;
 flex-wrap: wrap;
 `), cssr_1.cB('base-selection-tag-wrapper', `
 max-width: 100%;
 display: inline-flex;
 padding: 0 7px 3px 0;
 `, [cssr_1.c('&:last-child', {
  paddingRight: 0
}), cssr_1.cB('tag', `
 font-size: 14px;
 max-width: 100%;
 `, [cssr_1.cE('content', `
 text-overflow: ellipsis;
 overflow: hidden;
 `)])]), ['warning', 'error'].map(status => cssr_1.insideFormItem(status, cssr_1.cB('base-selection', [cssr_1.cE('state-border', {
  border: `var(--border-${status})`
}), cssr_1.cNotM('disabled', [cssr_1.c('&:hover', [cssr_1.cE('state-border', `
 box-shadow: var(--box-shadow-hover-${status});
 border: var(--border-hover-${status});
 `)]), cssr_1.cM('active', [cssr_1.cE('state-border', `
 box-shadow: var(--box-shadow-active-${status});
 border: var(--border-active-${status});
 `), cssr_1.cB('base-selection-label', {
  backgroundColor: `var(--color-active-${status})`
}), cssr_1.cB('base-selection-tags', {
  backgroundColor: `var(--box-shadow-active-${status})`
})]), cssr_1.cM('focus', [cssr_1.cE('state-border', `
 box-shadow: var(--box-shadow-focus-${status});
 border: var(--border-focus-${status});
 `)])])])))]);