/*!
 * MediaWiki Widgets – JS DateInputWidget styles.
 *
 * @copyright 2011-2015 MediaWiki Widgets Team and others; see AUTHORS.txt
 * @license The MIT License (MIT); see LICENSE.txt
 */

.oo-ui-unselectable() {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

@size-indicator: unit( 12 / 16 / 0.8, em );

.mw-widget-dateInputWidget {
	&-handle {
		.oo-ui-unselectable();

		> .oo-ui-indicatorElement-indicator {
			display: none;
		}
	}

	&.oo-ui-indicatorElement .mw-widget-dateInputWidget-handle > .oo-ui-indicatorElement-indicator {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: @size-indicator;
		height: 100%;
		margin: 0 0.775em;
	}

	> .oo-ui-textInputWidget {
		z-index: 2;
	}

	&-calendar {
		background-color: #fff;
		position: absolute;
		margin-top: -2px;
		border-radius: 2px;
		box-shadow: 0 2px 2px 0 rgba( 0, 0, 0, 0.25 );
		z-index: 1;

		&:focus {
			box-shadow: inset 0 0 0 1px #36c, 0 2px 2px 0 rgba( 0, 0, 0, 0.25 );
			z-index: 3;
		}
	}

	&-empty {
		.mw-widget-dateInputWidget-handle {
			color: #54595d;
			outline: 0;
		}
	}

	&.oo-ui-flaggedElement-invalid {
		.mw-widget-dateInputWidget-handle {
			border-color: #d33;
			box-shadow: none;
		}
	}

	&.oo-ui-widget-enabled {
		.mw-widget-dateInputWidget-handle:hover {
			border-color: #72777d;
		}

		.oo-ui-inputWidget-input[ readonly ]:not( .oo-ui-pendingElement-pending ) ~ .mw-widget-dateInputWidget-handle {
			background-color: #f8f9fa;
		}
	}

	&.oo-ui-widget-disabled {
		.mw-widget-dateInputWidget-handle {
			background-color: #eaecf0;
			color: #72777d;
			border-color: #c8ccd1;
			text-shadow: 0 1px 1px #fff;
			cursor: default;

			> .oo-ui-indicatorElement-indicator {
				opacity: 0.51;
			}
		}
	}
}
