.p-t-5 { padding-top: 5px }

/* BUGFIX: Force buttons to be a consistant height when no icon is actually visible */
mg-choice-buttons .fa.fa-fw {
	height: 1em;
}

@media print {
	/* Disable dropdown icons when printing */
	mg-choice-dropdown .selectize-input::after {
		display: none !important;
	}
}

.ui-select-placeholder {
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: calc(100% - 15px);
}
/* mgContainerRowLarge {{{ */
.row.mgContainerRowLarge {
	font-size: 200%;
}

.row.mgContainerRowLarge input.form-control {
	height: 48px;
}
/* }}} */

mg-form .form-group {
	margin-bottom: 10px;
}

/* Generic helper classes {{{ */
mg-form-editor .text-nowrap {
	white-space: nowrap;
}

mg-form-editor .text-ellipsis {
	overflow: hidden;
	text-overflow: ellipsis;
}

/* }}} */

/* Add widget modal {{{ */
/* Tidy up the left hand size widget filter pills {{{ */
mg-form-editor #modal-mgFormEditor-add .nav.nav-pills li:not(.active) a {
	color: #333;
}

mg-form-editor #modal-mgFormEditor-add .nav.nav-pills li.active i> a {
	color: #FFF;
}

mg-form-editor #modal-mgFormEditor-add .nav.nav-pills > a > i {
	margin-right: 5px;
}
/* }}} */
/* Tidy up the main widget selection boxes {{{ */
mg-form-editor #modal-mgFormEditor-add .widget-item {
	margin-bottom: 5px;
}
/* }}}
/* }}} */

/* Hover mask {{{ */
@keyframes mgFormMoveMaskEditor { from { background-position: 0; } to { background-position: 140px; } }

mg-form-editor .mgFormEditor-mask {
	position: fixed;
	z-index: 100;
	border-radius: 5px;

	/* Start offscreen */
	left: -10000px;
	top: -10000px;
	width: 0px;
	height: 0px;
}

mg-form-editor .mgFormEditor-mask.mgFormEditor-mask-editor  {
	border: 3px solid #5662a8;
}

mg-form-editor .mgFormEditor-mask.mgFormEditor-mask-inserter  {
	border: 3px solid #56a628;
}

mg-form-editor .mgFormEditor-mask.mgFormEditor-mask-editor > .mgFormEditor-mask-background {
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	animation: mgFormMoveMaskEditor 5s linear 0s infinite;
	opacity: 0.3;
	background: repeating-linear-gradient(
		45deg,
		#606dbc,
		#606dbc 10px,
		#5662a8 10px,
		#5662a8 20px
	);
	background-size: 140px 140px;
}

mg-form-editor .mgFormEditor-mask.mgFormEditor-mask-inserter > .mgFormEditor-mask-background {
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0.3;
	background: repeating-radial-gradient(
		circle,
		#60bc6d,
		#60bc6d 40px,
		#56a862 40px,
		#56a862 80px
	);
}

mg-form-editor .mgFormEditor-mask .mgFormEditor-mask-buttons {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

mg-form-editor .mgFormEditor-mask .mgFormEditor-mask-buttons > .mgFormEditor-mask-buttons-left {
	position: absolute;
	top: calc(50% - 16px);
	left: 10px;
}

mg-form-editor .mgFormEditor-mask .mgFormEditor-mask-buttons > .mgFormEditor-mask-buttons-right {
	position: absolute;
	top: calc(50% - 16px);
	right: 10px;
}

mg-form-editor .mgFormEditor-mask .mgFormEditor-mask-buttons a {
	padding: 8px 12px !important;
}

mg-form-editor .mgFormEditor-mask .mgFormEditor-mask-buttons .mgFormEditor-mask-handle {
	cursor: move;
}

mg-form-editor .mgFormEditor-mask .mgFormEditor-mask-buttons .dropdown-menu a {
	padding: 3px 10px;
}
/* }}} */

mg-list td {
	padding: 0 !important;
}

mg-list td input.form-control {
	border: none;
}

mg-list td .btn {
	height: 35px;
}

mg-list td .btn > i {
	padding-top: 4px;
}

mg-list td:first-child.text-center {
	vertical-align: middle;
}

/* Hide the spin button in mgNumber controls */
mg-number input[type=number]::-webkit-outer-spin-button,
mg-number input[type=number]::-webkit-inner-spin-button {
	/* display: none; <- Crashes Chrome on hover */
	-webkit-appearance: none;
	margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

mg-placeholder > div {
	height: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
}

/* Style: placeholder-box {{{ */
mg-placeholder > .placeholder-box {
	border: 1px solid #000;
	background:
		linear-gradient(to top left,
			rgba(0,0,0,0) 0%,
			rgba(0,0,0,0) calc(50% - 1px),
			rgba(0,0,0,1) 50%,
			rgba(0,0,0,0) calc(50% + 1px),
			rgba(0,0,0,0) 100%),
		linear-gradient(to top right,
			rgba(0,0,0,0) 0%,
			rgba(0,0,0,0) calc(50% - 1px),
			rgba(0,0,0,1) 50%,
			rgba(0,0,0,0) calc(50% + 1px),
			rgba(0,0,0,0) 100%);
}

mg-placeholder > .placeholder-box > .placeholder-text {
	background: #FFF;
	border: 1px solid #000;
	padding: 10px 15px;
}
/* }}} */

/* Style: placeholder-construction {{{ */
mg-placeholder > .placeholder-construction {
	background: repeating-linear-gradient(45deg, #dfc458, #dfc458 10px, #666 10px, #666 20px);
}

mg-placeholder > .placeholder-construction > .placeholder-text {
	font-size: 24pt;
	color: #FFF;
	text-shadow: -2px -2px 1px #000, 2px -2px 1px #000, -2px 2px 1px #000, 2px 2px 1px #000;
}
/* }}} */

mg-seperator > hr {
	margin-top: 0px;
	margin-bottom: 10px;
}

mg-signature .form-control-static {
	display: block;
	width: 250px;
	height: 50px;
	border: 1px solid #e9e9e9;
	background: #FFF;
}

mg-signature .form-control-static::after {
	content: '';
	display: block;
	position: relative;
	top: 30px;
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	border-bottom: 1px dashed #e9e9e9;
}

mg-signature .btn.btn-fab {
	position: absolute;
	left: 0;
	bottom: 10px;
}

mg-signature .btn.btn-fab > i.fa {
	margin-left: -2px;
	margin-top: 6px;
}

mg-table td {
	padding: 0 !important;
}

mg-table td > .btn {
	height: 35px;
}

mg-table td > mg-container > .form-group {
	margin: 0 !important;
}

mg-table td > mg-container > .form-group .col-sm-12 {
	padding: 0 !important;
}

mg-table td > mg-container > .form-group .col-sm-12 .form-control {
	border: none;
}

mg-form .table-compact .form-group {
  margin: 0;
}

mg-form .table-compact select,
mg-form .table-compact input,
mg-form .table-compact .form-control,
mg-form .table-compact .form-control-static {
	background: transparent;
  border-color: transparent;
	box-sizing: border-box;
	height: auto;
	min-height: auto;
  padding: 0;
}

mg-form .table-compact .col-xs-1,
mg-form .table-compact .col-sm-1,
mg-form .table-compact .col-md-1,
mg-form .table-compact .col-lg-1,
mg-form .table-compact .col-xs-2,
mg-form .table-compact .col-sm-2,
mg-form .table-compact .col-md-2,
mg-form .table-compact .col-lg-2,
mg-form .table-compact .col-xs-3,
mg-form .table-compact .col-sm-3,
mg-form .table-compact .col-md-3,
mg-form .table-compact .col-lg-3,
mg-form .table-compact .col-xs-4,
mg-form .table-compact .col-sm-4,
mg-form .table-compact .col-md-4,
mg-form .table-compact .col-lg-4,
mg-form .table-compact .col-xs-5,
mg-form .table-compact .col-sm-5,
mg-form .table-compact .col-md-5,
mg-form .table-compact .col-lg-5,
mg-form .table-compact .col-xs-6,
mg-form .table-compact .col-sm-6,
mg-form .table-compact .col-md-6,
mg-form .table-compact .col-lg-6,
mg-form .table-compact .col-xs-7,
mg-form .table-compact .col-sm-7,
mg-form .table-compact .col-md-7,
mg-form .table-compact .col-lg-7,
mg-form .table-compact .col-xs-8,
mg-form .table-compact .col-sm-8,
mg-form .table-compact .col-md-8,
mg-form .table-compact .col-lg-8,
mg-form .table-compact .col-xs-9,
mg-form .table-compact .col-sm-9,
mg-form .table-compact .col-md-9,
mg-form .table-compact .col-lg-9,
mg-form .table-compact .col-xs-10,
mg-form .table-compact .col-sm-10,
mg-form .table-compact .col-md-10,
mg-form .table-compact .col-lg-10,
mg-form .table-compact .col-xs-11,
mg-form .table-compact .col-sm-11,
mg-form .table-compact .col-md-11,
mg-form .table-compact .col-lg-11,
mg-form .table-compact .col-xs-12,
mg-form .table-compact .col-sm-12,
mg-form .table-compact .col-md-12,
mg-form .table-compact .col-lg-12 {
	padding: 0;
}

mg-form .table-compact > thead > tr > th,
mg-form .table-compact > tbody > tr > th,
mg-form .table-compact > tfoot > tr > th {
	padding: 4px;
}

mg-form .table-compact > thead > tr > td,
mg-form .table-compact > tbody > tr > td,
mg-form .table-compact > tfoot > tr > td {
	padding: 0;
}

mg-table td > .btn {
	height: auto;
}

mg-form .table-compact .btn {
	padding: 0;
}

.table.table-compact > tbody > tr > td,
.table.table-compact > tbody > tr > th,
.table.table-compact > tfoot > tr > td,
.table.table-compact > tfoot > tr > th,
.table.table-compact > thead > tr > td,
.table.table-compact > thead > tr > th {
	line-height: normal;
}

.table-darker {
	border-color: black;
}

.table-darker.table-bordered > tbody > tr > td,
.table-darker.table-bordered > tbody > tr > th,
.table-darker.table-bordered > tfoot > tr > td,
.table-darker.table-bordered > tfoot > tr > th,
.table-darker.table-bordered > thead > tr > td,
.table-darker.table-bordered > thead > tr > th {
	border-color: black;
}

.table-compact input[type="date"].form-control,
.table-compact input[type="time"].form-control,
.table-compact input[type="datetime-local"].form-control,
.table-compact input[type="month"].form-control {
	line-height: inherit;
}

@media print {
	/* Toggle selection needs to be more visible in monochrome prints */
	mg-toggle .btn.btn-default {
		background: #398439 !important;
		color: #fff !important;
	}
}