.view-space {
	> .heading {
		height: 10px;

		> .view-heading {
			font-size: 1.5rem;
			font-weight: bold;
			color: $color-dark;
		}
	}

	> .filter-caption {
		color: $color-gray;
		font-size: 1.0rem;
		margin: 0 0 10px 0;
	}

	> .documents {
		margin: 60px 0;
		padding: 0;

		> .document {
			@include card();
			@include ease-in();
			list-style-type: none;
			overflow: hidden;
			position: relative;
			margin: 0 0 30px 0;
			width: 100%;
			// height: 150px;

			&:hover {
				> .checkbox {
					display: block;
				}
			}

			> a {
				@include ease-in();
				display: block;
				position: relative;
				padding: 15px 20px;

				> .title {
					color: $color-black;
					font-size: 1.3rem;
					margin-bottom: 5px;
				}

				> .snippet {
					color: $color-gray;
					font-size: 1rem;
					line-height: 24px;
				}

				&:hover {
					color: $color-gray;

					> .title {
						color: $color-link;
					}

					> .snippet {
						color: $color-link;
					}
				}
			}

			> .checkbox {
				position: absolute;
				display: none;
				top: 10px;
				right: 20px;
				cursor: pointer;

				> .material-icons {
					width: 10px;
					margin: 0;
					padding: 0;
					color: $color-checkbox;
				}
			}

			> .actions {
				position: absolute;
				display: none;
				bottom: 2px;
				right: 12px;
				cursor: pointer;
			}
		}

		> .selected {
			background-color: $color-primary-light !important;

			> .checkbox {
				display: block;
			}

			> .actions {
				display: block;
			}
		}
	}

	.hashtags {
		> .hashtag {
			display: inline-block;
			margin: 5px 10px 0 5px;
			color: $color-gray;
			font-size: 0.875rem;
			font-style: italic;

			&:hover {
				color: $color-link;
			}
		}
	}
}

.space-admin {
	> .title {
		font-size: 1.5rem;
		font-weight: bold;
		color: $color-dark;
	}

	> .sub-title {
		font-size: 1.1rem;
		color: $color-gray;
	}

	> .permission-table {
		> tbody, > thead {
			> tr, > th {
				> td, > th {
					margin: 0;
					padding: 10px 15px;
					text-align: center;
				}

				> td:first-child {
					text-align: left;
				}
			}
		}

		> thead {
			> tr {
				> th {
					background-color: $color-off-white;
					color: $color-gray;
				}

				> th:first-child {
					background-color: $color-white !important;
					border: none !important;
				}
			}
		}
	}

	> .categories {
        padding: 0;
        margin: 0;

		> .item {
			margin: 15px 0;
			padding: 15px;
			@include card();
			@include ease-in();

			> .category {
				display: inline-block;

				> .name {
					font-size: 1.2rem;
					color: $color-primary;
				}

				> .info {
					font-size: 0.9rem;
					margin-top: 8px;
					color: $color-gray;
				}
			}

			> .buttons {
				margin-top: 5px;
			}

			> .action {
				display: inline-block;
			}
		}
	}
}
