/*
	svg-editor.css
*/

.svg-editor {
	position: absolute;
	left: 0px;
	right: 0px;
	bottom: 0px;
	top: 0px;
	overflow: hidden;
}

.svg-element-list {
	background-color: #EEEEEE;
	position: absolute;
	top: 60px;
	right: 0px;
	height: calc((100vh - 60px) / 2);
	overflow: hidden;
	width: 200px;
}

.svg-el-list {
	height: 100%;
	width: 100%;
}

.svg-property-grid {
	background-color: #DDDDDD;
	position: absolute;
	bottom: 0px;
	right: 0px;
	height: calc((100vh - 60px) / 2);
	overflow: auto;
	width: 200px;
}

	div.svg-property-grid > td {
		padding: 0px;
		border-spacing: 0px;
	}

.svg-prop-grid-name {
	font-weight: bold;
	width: 80px;
	font-size: 12px;
}

.svg-prop-grid-value {
	width: 80px;
	font-size: 12px;
}

.svg-toolbar {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	height: 60px;
	background-color: #DDDDDD;
}

.svg-toolbar-icon {
	font-size: 40px;
	color: #000000;
	width: 60px;
}

.svg-toolbar-icon-selected {
	color: #0000FF;
}

.svg-toolbar-exit {
	color: #FF0000;
}

.svg-toolbar-save {
	color: #0000FF;
}


.svg-document-view {
	position: absolute;
	top: 60px;
	left: 0px;
	right: 200px;
	bottom: 0px;
	overflow: scroll;
}

.svg-input-command {
	position: absolute;
	top: 0px;
	left: 0px;
	border: none;
	padding: 0px;
	margin: 0px;
	height: 30px;
	width: 10px
}

.svg-document {
	stroke-width: 1px;
	stroke: #000000;
	fill: #FFFFFF;
	filter: drop-shadow(10px 10px 3px rgb(0 0 0 / 0.4));
}

.svg-margin {
	stroke-width: 1px;
	stroke: silver;
	fill: transparent;
	stroke-dasharray: 10 10;
}


.el-non-selected {
	stroke: none;
	cursor: pointer;
	fill: transparent;
}

.el-line-non-selected {
	stroke-width: 10px;
	stroke: transparent;
	cursor: pointer;
	fill: none;
}

.el-selected {
	stroke: none;
	cursor: move;
	fill: rgba(255,255,0,0.3);
}

.el-line-selected {
	stroke-width: 10px;
	stroke: rgba(255,255,0,0.3);
	cursor: move;
	fill: none;
}

.el-selected-corner-nw-se {
	stroke: none;
	cursor: nwse-resize;
	fill: green;
}

.el-selected-corner-ne-sw {
	stroke: none;
	cursor: nesw-resize;
	fill: green;
}

.el-selected-corner-ew {
	stroke: none;
	cursor: ew-resize;
	fill: green;
}

.el-selected-corner-ns {
	stroke: none;
	cursor: ns-resize;
	fill: green;
}

.svg-doc-add-area {
	fill: transparent;
	stroke: none;
	cursor: crosshair;
}