/* BASE */
form {
	overflow:hidden;
}
form > *, form div.field {
	display:block;
	margin-top: var(--margin);
}
div.nsp-form form > *:first-child, div.nsp-form form div.field:first-child {
	margin-top: 0em;
}
form div.inner-fields div.field:first-child {
	margin-top: 0 !important;
}

form input, form textarea, form select, form select+div.select, form .has-transition { transition:all .3s ease 0s; }
form input[type="text"], 
form input[type="password"],
form input[type="date"],
form input[type="email"],
form input[type="search"],
form input[type="tel"],
form input[type="time"],
form input[type="number"],
form input[type="url"],
form textarea,
form select,
form select + div.select {
	background: var(--input-bg-color);
	border:1px solid var(--border-color);
	padding:var(--input-padding);
	width:100%;
	border-radius:var(--border-radius);
	color:var(--input-color); /*var(--text-color);*/
}
form textarea {
	height: calc(var(--textarea-row-num) * var(--line-height) + 1em + 2px);
}
/* SEPARATED */
form div.field.sep {
	border-top:1px solid var(--border-color);
	padding-top: calc( var(--padding-y) * 2);
}
/* SMALL */
form div.field.small * {
	font-size:var(--font-size-small);
	line-height:var(--line-height-small);
}
/* INLINE */
form div.field.inline-el {
	display: flex;
	flex-direction:row;
	flex-wrap:nowrap;
}
form div.field.inline-el > label {
	text-align: right;
	flex-grow: 0;
  	flex-shrink: 0;
	align-self:center;
	white-space: nowrap;
}
form div.field.inline-el.label-align-left > label {
	text-align: left;
}
form div.field.inline-el > div.input {
	margin-top: 0;
	flex-grow:1;
	margin-left: 1em;
}
form div.field.inline-el.fit-to-content > div.input {
	flex-grow: initial;
}
form div.field.inline-el.text > *, 
form div.field.inline-el.password > *, 
form div.field.inline-el.date > *,
form div.field.inline-el.email > *,
form div.field.inline-el.number > *,   
form div.field.inline-el.select > * {
	align-self:center;
}
form div.field.inline-el ul.choices > li {
	margin-top: 0em;
}
/* MARGIN */
form > *:first-child {
	margin-top:0 !important;
}
/* LABEL */
form label {
	user-select: none;
}
form label > span.label {
	font-weight:600;
	color:inherit;
	transition:inherit;
}
form div.required label > span.label::after {
	position: relative;
	content:'*';
	color:var(--required-color);
	vertical-align: baseline;
	top: -0.4em;
}
form div.required-off label > span.label::after {
	display: none;
}
form label > span.label-comment {
	font-size:var(--font-size-small);
	line-height: var(--line-height-small);
	font-weight: 300;
	font-style: italic;
	color:var(--text-sub-color);
	display:block;
}
/* LABEL INLINE */
form div.label-inline input + label {
	position: absolute;
	top:1px;
	left:0px;
	cursor: text;
	padding:var(--input-padding);
	color: var(--text-sub-color);
	transition:all .3s;
}
form div.label-inline input + label span {
	transition:all .3s;
	font-weight: 400;
}
form div.label-inline input + label span::after {
	display: none;
}
form div.label-inline input:focus + label, form div.label-inline input.hasval + label {
	padding:0 var(--label-padding);
	background-color: #fff;
	top:calc(-1 * var(--font-size-small));
	left:var(--input-margin);
	color: var(--text-color);
}
form div.label-inline input:focus + label, form div.label-inline input:hover + label {
	color: var(--color1);
}
form div.label-inline input:focus + label span, form div.label-inline input.hasval + label span {
	line-height: var(--font-size-small);
	font-size: var(--font-size-small);
}
form input:autofill, form input:-webkit-autofill, form input.autofill {
	background: transparent !important;
	border:1px solid var(--border-color) !important;
}
form label + div.input {
	margin-top: .5em;
}
/* SPAN EMPTY - CONDITION */
/*form span.empty-info {
	font-size:.9em;
	font-weight: 300;
}
form span.empty-info > span {
	font-size:inherit;
	font-weight: 400;
}
form span.empty-info ~ * {
	display: none;
}*/

/* CONDITIONB/RELEVANCE - FOR PSEUDO HIDE */
form div[style*="visibility: hidden"] *,
form div[style*="visibility: hidden"] *::before,
form div[style*="visibility: hidden"] *::after {
	transition:none !important;
}

/* HOVER */
form input[type="text"]:hover, 
form input[type="password"]:hover,
form input[type="date"]:hover,
form input[type="email"]:hover,
form input[type="search"]:hover,
form input[type="tel"]:hover,
form input[type="time"]:hover,
form input[type="number"]:hover,
form input[type="url"]:hover,
form textarea:hover,
form select:hover,
form select:hover + div.select,
form input[type="checkbox"]:hover + label::before,
form input[type="radio"]:hover + label::before {
	border:1px solid var(--border-hover-color) !important;
}
form ul.choices input[type="radio"]:not([disabled]):hover + label, form ul.choices input[type="checkbox"]:not([disabled]):hover + label {
	color:var(--choice-hover-color);
}
form select:hover + div.select::after {
	border-top:7px solid var(--select-face-color);
}
/* FOCUS */
form input[type="text"]:focus, 
form input[type="password"]:focus,
form input[type="date"]:focus,
form input[type="email"]:focus,
form input[type="search"]:focus,
form input[type="tel"]:focus,
form input[type="time"]:focus,
form input[type="number"]:focus,
form input[type="url"]:focus,
form textarea:focus,
form input[type="checkbox"]:focus + label::before,
form input[type="radio"]:focus + label::before,
form select:focus,
form select:focus + div.select {
	border:1px solid var(--border-focus-color) !important;
}
form ul.choices input[type="radio"]:not([disabled]):focus + label, form ul.choices input[type="checkbox"]:not([disabled]):focus + label {
	color:var(--choice-focus-color);
}
form select:focus + div.select::after {
	border-top:7px solid var(--select-face-color);
}
/* HIDE */
form input[type="checkbox"][style*="none"] + label, form input[type="radio"][style*="none"] + label {
	display: none;
}
/* READONLY */
form input[readonly], form textarea[readonly], form select[readonly],
form input[readonly]:hover, form textarea[readonly]:hover, form select[readonly]:hover,
form input[readonly]:focus, form textarea[readonly]:focus, form select[readonly]:focus,
form ul.choices[readonly] input + label::before {
	cursor: default !important;
	border:1px solid var(--border-color) !important;
	background-color:var(--readonly-color) !important;
	color:var(--text-color);
}
form div.readonly-cover {
	position: absolute;
	top:0px;
	left:0px;
	z-index: 1;
	width:100%;
	height:100%;
}
/* DISABLED */
form input[disabled], form textarea[disabled], form select[disabled] {
	opacity:.5;
	cursor: default !important;
	border:1px solid var(--border-color) !important;
	background-color:var(--disabled-color);
}
form button[disabled] {
	opacity:.5;
	border:none !important;
	cursor: not-allowed !important;
}
form option[disabled] {
	border:none !important;
}
form input[type="checkbox"][disabled], form input[type="radio"][disabled] {
	opacity:0;
}
form input[type="checkbox"][disabled] + label, form input[type="radio"][disabled] + label {
	opacity:.5;
	cursor: default !important;
}
form input[type="checkbox"][disabled] + label::before, form input[type="radio"][disabled] + label::before {
	border:1px solid var(--border-color) !important;
}
form select option[disabled] {
	color:var(--disabled-option-color);
}
/* HEAD */
form div.head > span {
	background-color: var(--panel-bg-color);
	color:var(--color1);
	font-size:var(--font-size-large);
	line-height: var(--line-height-large);
	text-transform: uppercase;
	/*padding:0.2em 0.5em;*/
	padding-right:.5em;
	user-select: none;
	cursor: default;
	/*border-radius:var(--border-radius);*/
}
form div.head::before {
	top:50%;
	width:100%;
	height:1px;
	background-color: var(--form-head-base-color);
	position: absolute;
	content:'';
	opacity:.5;
}
form div.head > span * {
	color:inherit;
	line-height: inherit;
	font-size: inherit;
	text-transform: inherit;
}
/* INFO */
form span.info.empty {
	color:var(--text-sub-color);
	font-style: italic;
	font-weight: 300;
}

/* COPY */
form div.field.copy-off {
	opacity:.5;
}
/* REMOVE */
form::after {
	content:'';
	position: absolute;
	width:100%;
	height:100%;
	z-index: 200;
	top:0px;
	left:0px;
	background: #fff;
	opacity:0;
	visibility: hidden;
	transition:opacity .3s;
}
form.remove::after {
	opacity:.5;
	visibility: visible;
}

/* LOADER */
form div.field.loading div.input::after {
	position: absolute;
	content:'';
	opacity:.8;
	background-image: var(--preloader);
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-color: #fff;
	background-position: left top;
	width:100%;
	height: 100%;
	top:0px;
	left:0px;
}

/* INPUT COMMENT TEXT */
form div.input.comment-text {
	margin-top: .5em;
}
form div.input.comment-text * {
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

/* PRELOADER */
form div.form.preloader {
	position: absolute;
	background-color: #fff;
	z-index: 10;
}
form div.form.preloader > div {
	box-shadow:none;
	width:30px;
	height: 30px;
	background-size: 100% auto;
}
form div.form.preloader > div div.progress-bar {
	display:none;
}