label { display:block; width:100%; padding:0 10px; box-sizing:border-box; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
input,
select,
.v-select,
textarea { border-radius: var(--border-radius); width:100%; display:block; height:42px; line-height:40px; padding:0 10px; font-size:inherit; font-family:inherit; background:var(--color-white); border:1px solid var(--color-border);box-sizing:border-box; -webkit-appearance: none; appearance: none; }
input:focus,
select:focus,
textarea:focus,
input:hover,
select:hover,
textarea:hover,
input:focus,
select:focus,
textarea:focus {
    border-color:var(--color-primary);
    outline: none;
}
input {  }
select {  }
textarea { resize: none; line-height:20px; padding-top:10px; padding-bottom:10px; min-height:42px; height:102px; }
fieldset { display:block; }
fieldset legend,
fieldset .legend {	display:block; font-style: normal; font-weight: bold; }

input.error,
textarea.error {
	border-color: var(--color-negative);
}

/* checkbox, radio */
input[type="radio"],
input[type="checkbox"] { width:0; height:0; padding:0; margin:0; opacity:0.01; overflow:hidden; }
input[type="radio"] + label,
input[type="checkbox"] + label { cursor: pointer; display:block; position:relative; padding:10px 10px 10px 30px; line-height:20px; height:42px; box-sizing:border-box; width:100%; color:inherit; background:none; }
input[type="radio"] + label:before,
input[type="checkbox"] + label:before { display:block; position:absolute; left:1px; top:11px; width:20px; height:20px; content:' '; border:2px solid var(--color-border); border-radius:var(--border-radius); background:var(--color-white); }
input[type="radio"] + label:before { border-radius:100px; }
input[type="radio"] + label:after,
input[type="checkbox"] + label:after { display:block; position:absolute; left:0px; top:10px; width:22px; height:22px; line-height:22px; opacity:0; text-align:center; content:"\e917"; font-family:'d-icomoon'; color:var(--color-primary); }
input[type="radio"] + label:after { content:' '; width:8px; height:8px; left:7px; top:17px; background:var(--color-primary); border-radius:var(--border-radius); }
input[type="radio"]:focus + label:before,
input[type="checkbox"]:focus + label:before,
input[type="radio"]:hover + label:before,
input[type="checkbox"]:hover + label:before { border-color:var(--color-primary); }
input[type="radio"]:checked + label:after,
input[type="checkbox"]:checked + label:after { opacity:1; }
input[type="radio"][readonly] + label,
input[type="checkbox"][readonly] + label,
input[type="radio"][disabled] + label,
input[type="checkbox"][disabled] + label { color:var(--color-disabled); pointer-events: none; cursor:not-allowed; }

/* vue select */
.v-select { padding-left:0; padding-right:0; }
.v-select .vs__dropdown-toggle { padding:0; border:none; height:100%; }
.v-select .vs__selected-options { padding:0; }
.v-select .vs__selected-options .vs__search { margin:0; padding:0 10px; border:none; line-height:inherit; font-size:inherit; }
.v-select .vs__selected-options .vs__selected { position:relative; color:inherit; line-height:inherit; font-size:inherit; margin:5px 0 5px 5px; height:30px; padding:0 10px; }
.v-select .vs__selected-options .vs__selected .vs__deselect { position:absolute; top:0; right:0; width:10px; height:10px; margin:-5px; }
.v-select .vs__selected-options .vs__selected .vs__deselect:hover { background:none; fill:var(--color-negative); }
.v-select .vs__actions { cursor:pointer; }
.v-select .vs__actions .vs__clear { fill:var(--color-disabled); padding:0 4px; margin:0; }
.v-select .vs__actions .vs__clear:hover { fill:var(--color-negative); background:none; }
.v-select .vs__actions .vs__open-indicator { fill:var(--color-disabled); }
.v-select .vs__actions .vs__spinner {  }
.v-select .vs__dropdown-toggle:hover + .vs__actions > .vs__open-indicator { fill:var(--color-primary); }
.v-select .vs__dropdown-menu { padding:0 1px;  border:1px solid var(--color-border); }
.v-select .vs__dropdown-menu .vs__dropdown-option { }
.v-select .vs__dropdown-menu .vs__dropdown-option:before { display:none; content:none; }
.v-select .vs__dropdown-menu .vs__dropdown-option > div { }
.v-select .vs__dropdown-menu .vs__dropdown-option > div > .select-option-label { padding:4px 10px; line-height:1em; }
.v-select .vs__dropdown-menu .vs__dropdown-option.vs__dropdown-option--highlight { background-color:#ddd; }
.v-select .vs__dropdown-menu .vs__dropdown-option.vs__dropdown-option--selected { }
.v-select .vs__dropdown-option .select-option-img { display:block; float:left; width:40px; height:40px; margin-right:10px; border-radius:20px; overflow:hidden; }
.v-select .vs__dropdown-option .select-option-img img { width:100%; }
.v-select .vs__dropdown-option .select-option-label { display:block; line-height:22px; }
.v-select .vs__dropdown-option .select-option-desc { display:block; font-size:0.8rem; line-height:18px; }
.v-select.vs--single .vs__selected-options .vs__selected {  }
.v-select[required="required"] .vs__actions .vs__clear { display:none; }


/* invalid, readonly, placeholder */
input[readonly],textarea[readonly],select[readonly] { color:var(--color-disabled); }
input[disabled],textarea[disabled],select[disabled] { color:var(--color-disabled); pointer-events: none; cursor:not-allowed; }
/* input:invalid, textarea:invalid { color:var(--text,#333); border-color:var(--color-negative); box-shadow:none; }*/
::-webkit-input-placeholder { color:var(--color-disabled); opacity:0.5; }/* Edge */
:-ms-input-placeholder 		{ color:var(--color-disabled); opacity:0.5; }/* Internet Explorer 10-11 */
::placeholder 				{ color:var(--color-disabled); opacity:0.5; }/*  */
.field_wrapper .placeholder { color:var(--color-disabled); opacity:0.5; }/* CSC placeholder - proc neni jako attribut a content ?*/


/* csc formulare */
.csc-field-wrapper { position:relative;	display:block; }
.field_wrapper { position:relative;	display:block; padding:0 0 20px 0px; }
.field_wrapper > .field_wrapper { padding:0px; }
.field_wrapper .placeholder { position:absolute; display:none; pointer-events: none; z-index:10; }
.field_wrapper[empty="true"] .placeholder {	display:block; }
.field_wrapper .state,
.field_wrapper .help { display:block; position:absolute; bottom:0px; padding:0 10px; font-size:10px; height:20px; line-height:20px; color:var(--neutral,#39f); }
.field_wrapper .state:before,
.field_wrapper .help:before { display:inline-block; vertical-align:top; margin-right:10px; }
.field_wrapper .state { display:none; font-weight:bold; }
.field_wrapper .error { color:var(--color-negative); }
.field_wrapper .error ~ .state.error { display: block; }
.field_wrapper .state.saved { display:block; color:var(--positive,#6c0); }
.field_wrapper .state.saved:before { content:'✓'; font-family:'icomoon'; }
.field_wrapper .state.working {	display:block; color:var(--neutral,#39f); }
.field_wrapper .state.working:before { content:'⤾'; font-family:'icomoon'; -webkit-animation:spin 1s linear infinite; -moz-animation:spin 1s linear infinite; animation:spin 1s linear infinite; }
.field_wrapper .state.error { display:none; color:var(--color-negative); }
.field_wrapper .state.error:before { content:'⚠'; font-family:'icomoon'; }
.field_wrapper .help:before { content:'ⓘ'; font-family:'icomoon'; }
form.loading input[type="submit"], form.loading button, form.loading .button { opacity:0.2; pointer-events:none; cursor:not-allowed; }
input[type="date"], input.csc-calendar-input { padding:4px 20px 4px 15px; }
.csc-field-wrapper[type="date"]:after { content:'▦'; font-family:'icomoon'; position: absolute; top:11px; right:7px; font-size:20px; pointer-events: none; }

/*
    Switch + slider
*/
.switch {
    position: relative;
    display: inline-block;
    overflow: inherit;
    width: 60px;
    height: 34px;
}

.switch--disabled input {
    cursor: default;
}

.switch--disabled .slider {
    cursor: default;
    background-color: #3f3e38 !important;
}

.switch--disabled .slider::before {
    color: #3f3e38 !important;
}
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
    display: none;
}

.switch input:checked + .slider {
    background-color: var(--color-primary);
}

.switch input:checked + .slider::before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
    background-color: #242521;
    content: "\e917";
    font-family: "icomoon";
    color: var(--color-white);
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #3f3e38;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider::before {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    content: "\2715";
	font-size: 16px;
    font-weight: 700;
    color: var(--color-white);
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: #242521;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider--round {
    border-radius: 34px;
}

.slider--round::before {
    border-radius: 50%;
}