.managelist {
	margin: 1rem 0 0 0;
}

.managelist .items {
}
.managelist .item {
	display: grid;
	grid-template: auto / calc(2.5rem + 1px) auto 9rem;
	min-height: 2.5rem; margin: 1rem 0 0 0;
	background: #fff; border: 1px solid #ccc;
}
.managelist .item:first-child {
	margin-top: 0;
}
.managelist .item.hug {
	margin-top: 0.125rem;
}
.managelist.sorted .item {
	position: relative;
	grid-template: auto / calc(2.5rem + 1px) auto calc(9rem + 1px) calc(2.5rem + 1px);
	min-height: 5rem;
}
.managelist .item .icons {
	grid-column: 1 / span 1; grid-row: 1 / span 1;
	padding: 0.25rem;
	background: #eee; border-right: 1px solid #ccc;
}
.managelist .item .icons .icon {
	display: block; position: relative;
	width: 2rem; height: 2rem;
	font-size: 1.125rem; line-height: 2rem; text-align: center; color: #999;
}
.managelist .item .icons .icon.tip {
	cursor: pointer;
}
.managelist .item .icons .icon.positive { color: #090; }
.managelist .item .icons .icon.negative { color: #b00; }
.managelist .item .icons .icon.neutral { color: #770; }
.managelist .item .icons .icon.tip:after {
	content: attr(data-tip);
	display: none; position: absolute;
	left: 1.75rem; top: 0; padding: 0.5rem 0.75rem;
	background: #333e; border-radius: 0.25rem;
	font-size: 0.875rem; color: #eee; white-space: nowrap; line-height: 1.125rem;
}
.managelist .item .icons .icon.tip.tipped:after {
	display: block;
}
.managelist .item .data {
	grid-column: 2 / span 1; grid-row: 1 / span 1;
	padding: 0.75rem;
}
.managelist .item .data.full {
	grid-column: 1 / span 3;
}
/* .managelist .item .data hr {
	height: 1px; margin: 0.75rem 0;
	background: #ddd;
} */
.managelist .item .data .datum {
	margin: 0.75rem 0 0 0;
	font-size: 0.9375rem; color: #444;
}
.managelist .item .data .datum:first-child {
	margin-top: 0;
}
.managelist .item .data .datum.primary {
	font-size: 1.125rem; font-weight: 600;
	cursor: pointer;
}
.managelist .item .data .datum.primary.null {
	color: #555;
	cursor: default;
}
.managelist .item .data .datum.alert {
	color: #b00;
}
.managelist .item .data .datum.urlref,
.managelist .item .data .datum.urlref a {
	color: #777; text-decoration: none;
}
.managelist .item .data .datum.urlref:hover,
.managelist .item .data .datum.urlref a:hover {
	text-decoration: underline;
}
.managelist .item .data .datum.sep {
	padding-top: 0.75rem;
	border-top: 1px solid #ddd;
}
.managelist .item .data .datum.notice {
	padding: 0.5rem;
	background-image: url(https://toomuchsmart.com/cdn/i/disabled-130.png); background-repeat: repeat; background-size: 65px; border: 1px solid #ddd;
	text-shadow: 0 0 1px #fff9; line-height: normal; color: #000;
}
.managelist .item .data .datum.notice.caution {
	background-color: #fffff0; border-color: #dd9;
}
.managelist .item .data .datum.notice.warn {
	background-color: #fff7f0; border-color: #da7;
}
.managelist .item .data .datum.notice.alert {
	background-color: #fff3f3; border-color: #d55;
}
.managelist .item .data .datum p {
	margin-top: 0.375rem;
	line-height: 1;
}
.managelist .item .data .datum p:first-child {
	margin-top: 0;
}
.managelist .item .data .datum .label {
	margin: 0 0 0.5rem 0;
	/* font-size: 0.75rem; font-weight: 600; text-transform: uppercase; */
}
.managelist .item .data .datum i {
	width: 1.25rem; margin-right: 0.375rem;
	text-align: center;
}

.managelist .item .data .datum .field {
	display: inline-block;
	white-space: nowrap;
}
.managelist .item .data .datum .field input {
	width: fit-content; margin: 0; padding: 0 0.125rem;
	border: none;
}
.managelist .item .data .datum .field.number input {
	width: 3rem;
	text-align: right;
}
.managelist .item .data .datum .field button {
	font-size: 1rem;
	cursor: pointer;
}
.managelist .item .data .datum .field button i {
	display: none;
	margin: 0;
}
.managelist .item .data .datum .field button i.edit {
	display: inline-block;
	margin: 0;
}
.managelist .item .data .datum .field.edit button i.edit { display: none; }
.managelist .item .data .datum .field.edit button i.submit { display: inline-block; }
.managelist .item .data .datum .field.sync button i.edit { display: none; }
.managelist .item .data .datum .field.sync button i.sync { display: inline-block; }

.managelist .item .controls {
	grid-column: 3 / span 1; grid-row: 1 / span 1;
	padding: 0.5rem;
	background: #fff; border-left: 1px solid #ddd;
}
.managelist .item .controls .ctrl {
	display: block; position: relative;
	margin-top: 0.5rem; padding: 0.5rem 0.75rem 0.5rem 0.5rem;
	background: #eee; box-shadow: 0 0 1px #777;
	font-size: 0.9375rem; line-height: 1rem;
	cursor: pointer;
}
.managelist .item .controls .ctrl:first-child {
	margin-top: 0;
}
.managelist .item .controls .ctrl.disabled {
	background: #f5f5f5; color: #ccc; box-shadow: none;
}
.managelist .item .controls .ctrl a {
	color: #000; text-decoration: none;
}
.managelist .item .controls .ctrl i {
	width: 1rem; margin-right: 0.375rem;
}
.managelist .item .sort {
	grid-column: 4 / span 1; grid-row: 1 / span 1;
	background: #eee; border-left: 1px solid #ccc;
}
.managelist .item .sort .ctrl {
	display: block; position: absolute;
	right: 0.25rem; width: 2rem; height: 2rem;
	font-size: 1rem; line-height: 2rem; text-align: center;
	cursor: pointer;
}
.managelist .item .sort .ctrl.up { top: 0.25rem; }
.managelist .item .sort .ctrl.down { bottom: 0.25rem; }
.managelist .item .sort .ctrl.disabled {
	opacity: 0.15;
	cursor: default;
}
.managelist .item .status {
	grid-column: 1 / span 3; grid-row: 2 / span 1;
	padding: 0.75rem;
	background-color: #fff; background-image: url(https://toomuchsmart.com/cdn/i/disabled-130.png); background-repeat: repeat; background-size: 65px; border-top: 1px solid #ccc;
	font-size: 0.9375rem; text-shadow: 0 0 1px #fff9;
}
.managelist.sorted .item .status {
	grid-column: 1 / span 4;
}
.managelist .item .status i {
	margin-right: 0.5rem;
}

.managelist .new {
	margin: 1rem 0 0 0; padding: 0.75rem 1rem;
	background: #fff; border: 1px solid #ccc;
	font-size: 1.125rem;
	cursor: pointer;
}
.managelist .new i {
	width: 1.25rem; margin-right: 0.375rem;
}
.managelist .upload {
	display: none;
}