@import '../../../scss/index.scss';

// Контент таблицы
@mixin content () {
	&,
	& * {
		@include fix();
	}

	.content {
		@include flex-row-max();
		overflow: hidden;
	}

	.view {
		@include flex-col-max();
		overflow: hidden;
	}
	.view--pinned {
		@include flex-col-auto();
	}

	.separator {
		@include flex-col-auto();
		@include hidden();
		position: relative;
		width: 0;
		&:after {
			content: '';
			position: absolute;
			top: 0;
			bottom: 0;
			right: 0;
			z-index: 1;
			pointer-events: none;
			border-right: 1px solid $row-border;
		}
	}

	.canvas {
		@include flex-col-auto();
	}

	.row {
		@include flex-row-auto();
		position: relative;
		&:after {
			content: '';
			position: absolute;
			bottom: 0;
			left: 0;
			right: 0;
			pointer-events: none;
			border-bottom: 1px solid $row-border;
		}
	}

	.cell {
		@include flex-col-auto();
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		background: $cell-bg;
	}
	.cell--swap {
		z-index: 1;
		&:after {
			content: '';
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			pointer-events: none;
			border-left: 1px solid $row-border;
			border-right: 1px solid $row-border;
			border-bottom: 1px solid $row-border;
		}
	}
	.cell--placeholder {
		background: $cell-placeholder-bg;
		* {
			opacity: 0;
			visibility: hidden;
		}
	}
}