/* 車両に画像指定ダイアログ */
#editImageDialog {
	top: 3vh;

	& div.dialog-main-message {
		padding: 1.0em;
		margin: 0 1.8em;
		border: solid 1px var(--formation-table-main-border);
		max-height: calc(100vh - 14em);
	}

	.input-area {
		font-size: 0.8rem;
		margin-bottom: 1em;
		width: 600px;

		& td:first-child {
			width: 6.5em;
		}
	}

	& select {
		width: calc(600px - 10.2rem);
	}

	#direction-selectbox,
	#loading-conditions-selectbox {
		width: unset;
	}

	.selectbox-fluctuation-button:has(#loading-conditions-selectbox) {
		margin-left: 1.0em;
	}

	& #edit-image-dialog-sticky-header {
		position: sticky;
		top: 0;
		left: 0;
		background: rgba(255, 255, 255, 0.9);
		z-index: 2;
	}

	/* 通常画像/反転時画像の切替 */
	#image-type-selector {
		display: flex;
		align-items: center;
		font-size: 0.85rem;
		margin: 0.4em 0;

		& label {
			cursor: pointer;
			display: inline-flex;
			align-items: center;
			gap: 0.3em;
		}

		#clear-reverse-image-button {
			margin-left: auto;
		}
	}

	/* 反転時画像モードの注意書き */
	#reverse-image-note {
		font-size: 0.72rem;
		color: #c0392b;
		background: rgba(192, 57, 43, 0.07);
		border-left: 3px solid #c0392b;
		padding: 0.4em 0.6em;
		margin-bottom: 0.5em;
		line-height: 1.5;
		width: 600px;
	}

	#addon-image-preview {
		text-align: center;

		.image-container {
			text-align: left;
			padding: 0.5em;
		}
	}

	#addon-image-whole-preview {
		width: 600px;
		position: relative;
		background-color: var(--simutrans-transparent);
		background-size: cover;
		background-repeat: no-repeat;
		display: none;

		&.on {
			display: block;
		}

		.addon-image-whole-preview-position-pointer {
			position: absolute;
			border: 2px solid #f00;
			display: none;
			cursor: default;

			&.cursor {
				border: 2px solid #00f;
				cursor: pointer;
			}

			&.on {
				display: block;
			}
		}
	}
}