/*!
 * VisualEditor ContentEditable SelectionManager styles.
 *
 * @copyright See AUTHORS.txt
 */

.ve-ce-surface-selections {
	pointer-events: none;

	.ve-ce-surface-selection {
		&-rect,
		&-bounding,
		&-cursor,
		&-gutter,
		&-label {
			position: absolute;
		}

		&-cursor {
			min-width: 2px;
			border: 1px solid;
			box-sizing: border-box;
		}

		&-gutter {
			left: 0;
			width: 2px;
		}

		&-label {
			font-size: 0.8em;
			font-weight: bold;
			color: #fff;
			text-shadow: 0 0 1px #000;
			padding: 0.2em;
			margin-top: -1.4em;
			height: 1em;
			line-height: 1;
			white-space: nowrap;
			max-width: 10em;
			overflow: hidden;
			text-overflow: ellipsis;
		}
	}

	/* Deactivated selections */

	&-deactivated {
		.ve-ce-surface-selection-rects {
			opacity: 0.5;
		}

		.ve-ce-surface-selection-rect {
			background: #6da9f7;
			/* Increase vertical height to look more like a system selection */
			margin-top: -0.15em;
			padding: 0.15em 0;
		}

		&-showAsDeactivated {
			.ve-ce-surface-selection-rects {
				opacity: 0.15;
			}

			.ve-ce-surface-selection-rect {
				background: #000;
			}
		}

		&-collapsed {
			opacity: 1;
			/* Color is matched to font in ve.ce.Surface.js */
		}
	}
}