@import "~scss/_mixins";

.pageMainType, 
.settingsPage.pageSettingsType,
.pageMainRelation {
	.wrapper { width: 704px; margin: 0px auto; padding: 40px 0px 90px 0px; user-select: none; }
	.wrapper.withIcon {
		.editorControls {
			#button-icon { display: none; }
		}
	}

	.wrapper {
		.block {
			.wrapMenu { display: none; }
			.wrapContent { width: 100%; }
		}
		.block.blockFeatured { padding: 0px; margin: 0px; line-height: 28px; }

		.section { margin-bottom: 44px; }
		.section:last-child { margin: 0px; }

		.editorControls { margin-bottom: 8px; }

		.section {
			.title { 
				@include text-paragraph; margin-bottom: 14px; position: relative; display: flex; flex-direction: row; align-items: center; 
				justify-content: space-between;
			}
			.title {
				.side.left { display: flex; flex-direction: row; align-items: center; gap: 0px 6px; }
				.side.right { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 0px 8px; }

				.icon.plus { background-image: url('~img/icon/plus/template.svg'); }
				.icon.more { background-image: url('~img/icon/menu/action/more0.svg'); }

				.cnt { color: var(--color-text-secondary); }
			}
		}

		.section.template {
			.listObjectPreview {
				.icon.arrow.left { left: -32px; }
				.icon.arrow.right { right: -32px; }
			}
		}
	}
}

.pageMainType > div > #loader { position: fixed; top: 0px; width: 100%; height: 100%; background: var(--color-bg-primary); z-index: 5; }