/* FORM *//* FORM *//* FORM *//* FORM */

/* Tag */

.m-ui [m-tag],
.m-ui m-tag {
  display: inline-block;
  text-decoration: none;
  border-radius: 50px;
  white-space: nowrap;
  overflow: -moz-hidden-unscrollable;
}
.m-ui [m-tag].with-icon,
.m-ui m-tag.with-icon {
	padding-left: 10px;
}
.m-ui [m-tag].with-icon-right,
.m-ui m-tag.with-icon-right {
	padding-right: 5px;
}


/* Label */

.m-ui [m-label],
.m-ui m-label {
	margin: 0;
	display: block;
	cursor: pointer;
}

/* Placeholder */

.m-ui input::-webkit-input-placeholder,
.m-ui textarea::-webkit-input-placeholder { 
  font-size: inherit; 
  transition: 0s ease-out;
  -webkit-transition: 0s ease-out;
  -moz-transition: 0s ease-out;
  -o-transition: 0s ease-out;
}
.m-ui input::-moz-placeholder,
.m-ui textarea::-moz-placeholder {  
  font-size: inherit; 
  transition: 0s ease-out;
  -webkit-transition: 0s ease-out;
  -moz-transition: 0s ease-out;
  -o-transition: 0s ease-out;
}
.m-ui input:focus::-webkit-input-placeholder,
.m-ui textarea:focus::-webkit-input-placeholder { 
	color: transparent; 
	font-size: inherit; 
}
.m-ui input:focus::-moz-placeholder,
.m-ui textarea:focus::-moz-placeholder { 
	color: transparent; 
	font-size: inherit; 
}


/* Input (textarea) */

.m-ui input, 
.m-ui textarea,
.m-ui [m-select] [m-control] {
  display: inline-block;
  cursor: pointer;
  width: 100%;
  max-width: 100% !important;
  font-size: inherit;
  outline: none;
  -webkit-appearance: none;
  transition: 0s ease-out;
  -webkit-transition: 0s ease-out;
  -moz-transition: 0s ease-out;
  -o-transition: 0s ease-out;
}

.m-ui input:active, 
.m-ui textarea:active,
.m-ui [m-select] [m-control]:active {
  transition: 0s ease-out;
  -webkit-transition: 0s ease-out;
  -moz-transition: 0s ease-out;
  -o-transition: 0s ease-out;
}

.m-ui input:disabled, 
.m-ui textarea:disabled,
.m-ui [m-select][disabled] [m-control] {
  cursor: default;
}


/* textarea */

.m-ui textarea {
  max-width: 100%;
  min-width: 100%;
}


/* CHECKBOX / RADIO */

.m-ui input[type="radio"],
.m-ui input[type="checkbox"] {
	display: none;
}

/* Checkbox/radio + Label */

/* Mark */
.m-ui input + label[m-check]:before {
	font-family: 'material';
	display: block;
	transform: scale(0);
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
}

/* Shadow in click */
.m-ui input + label[m-check]:after {
  content: '';
  display: block !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  border-radius: 50%;
  transform: scale(0);
  -webkit-transform: scale(0);
  transition: all .1s;
  -webkit-transition: all .1s;
}
.m-ui input + label[m-check]:active:after {
  content: '';
  transform: scale(1);
  -webkit-transform: scale(1);
}


.m-ui input + label[m-check] {
    cursor: pointer;
    display: inline-block;
    padding: 0;
    position: relative;
}

.m-ui input:checked + label[m-check]:before {
	transform: scale(1);
}

.m-ui input:disabled + label[m-check] {
	cursor: default;
}

/* Radio */

.m-ui input[type="radio"] + label[m-check] {
	border-radius: 50%;
}

/* Text for check */
.m-ui input + label[m-check] + * {
	text-align: left;
}

/* Switch */

.m-ui input:not[type="file"] + label { background: none !important; }

.m-ui input + label[m-swith] {
    display: inline-block;
    position: relative;
    cursor: pointer;
}

.m-ui input:disabled + label[m-swith] { cursor: default; }
.m-ui input:disabled + label[m-swith] {
  cursor: default;
}

.m-ui input:checked + label[m-swith]:hover {}
.m-ui input:checked:disabled + label[m-swith] {
  cursor: default;
  opacity: 1;
}

.m-ui input + label[m-swith]:before {
	content: '';
	display: inline-block;
	position: absolute;
}


/* select */

.m-ui [m-select] {
    position: relative;
}

.m-ui [m-select] > input { display: none; }

.m-ui [m-select] [m-control] {
    padding-left: 0;
}

.m-ui [m-select] [m-control]:before {
	font-family: 'material';
	display: inline-block;
	text-align: center;
}


/* Input FILE v-2 */

.m-ui input[type="file"] {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 3;
    opacity: 0;
    cursor: pointer;
    left: 0;
}

.m-ui input[type="file"] + label {
  	display: block;
  	text-align: center;
}

.m-ui input[type="file"] + label:before {
	font-family: 'material';
	display: block;
}

.m-ui input[type="file"] + label [m-loader]{
	position: absolute;
	display: none;
}

.m-ui input[type="file"] + label span {
  display: block;
  overflow-wrap: break-word;
  overflow: hidden;
}


/* Uploading */
.m-ui input[type="file"].loading { cursor: wait; }

.m-ui input[type="file"].loading + label:before {
	color: transparent;
}
.m-ui input[type="file"].loading + label [m-loader] {
	display: inline-block;
}


/* Disabled */
.m-ui input[type="file"]:disabled {
	cursor: default;
}



/* Datepicker */

.m-ui [m-calendar] {
  position: relative;
  display: inline-block;
}

.m-ui [m-calendar] input { 
  text-align: center; 
  cursor: pointer;
}

.m-ui [m-calendar] input + section {
  display: none;
  position: absolute;
  z-index: 10;
  overflow: hidden;
}
.m-ui [m-calendar] input:focus + section {
  display: block !important;
}
.m-ui [m-calendar] input + section.opened:hover { display: block; }

.m-ui [m-calendar] .datepickerDrop * {
    cursor: pointer;
    border: none;
    outline: none;
    box-shadow: none;
    border-spacing: 0;
}

.m-ui [m-calendar] .datepickerDrop th,
.m-ui [m-calendar] .datepickerDrop td {
    text-align: center;
    padding: 0 !important;
}

.m-ui [m-calendar] .table-condensed {
    width: 100%;
    padding: 0px;
}

.m-ui [m-calendar] .table-condensed .prev:before {
	content: '\e5cb';
}
.m-ui [m-calendar] .table-condensed .next:before {
	content: '\e5cc';
}
.m-ui [m-calendar] .table-condensed .prev:before,
.m-ui [m-calendar] .table-condensed .next:before {
	font-family: Material;
}

.m-ui [m-calendar] .table-condensed .switch {
  vertical-align: middle !important;
}
/*days of the week*/
.m-ui [m-calendar] .table-condensed .dow {
  font-size: 1.3rem;
  display: none;
}

.m-ui [m-calendar] .datepickerDrop span.month,
.m-ui [m-calendar] .datepickerDrop span.year {
    display: inline-block;
}

.m-ui [m-calendar] .datepickerDrop .old,
.m-ui [m-calendar] .datepickerDrop .new {
    cursor: default !important;
    opacity: .3;
}