//
// Variables
//
$sidebar-border-width: 1px !default;
$sidebar-border-style: solid !default;
$sidebar-border-color: #ddd !default;


//
// Exported selectors
//
[dir=rtl] {

	.#{$global-class-prefix}ui {

		.tailor {
			margin-left: 0;
			margin-right: $sidebar-width;
		}

		// Sidebar
		.tailor-sidebar {
			left: auto;
			right: 0;
			border-left: $sidebar-border-width $sidebar-border-style $sidebar-border-color;
			border-right: none;

			&__header {
				padding-left: 15px;
				padding-right: 0;

				.spinner {
					float: left;
				}

				.button-primary {
					float: left;
				}
			}

			&__control {
				float: right;
				padding-left: 2px;
				padding-right: 0;
				border-left: $sidebar-border-width $sidebar-border-style $sidebar-border-color;
				border-right: none;

				&::before {
					left: auto;
					right: 13px;
				}
			}
		}

		.back-button {
			float: right;
			border-left: $sidebar-border-width $sidebar-border-style $sidebar-border-color;
			border-right: none;

			&::before {
				content: "\f345";
			}
		}

		.help-button {
			left: $sidebar-border-width;
			right: auto;
		}

		.list--primary {

			.list__label::after {
				content: "\f341";
				left: 0;
				right: auto;
			}
		}

		.list {

			.element {

				&__badge {
					left: -$sidebar-border-width;
					right: auto;
				}

				&::before {
					padding-left: 0.75em;
					padding-right: 0;
					float: right;
				}
			}

		}

		.collapse-sidebar {
			left: auto;
			right: 10px;

			&-arrow {

				&::before {
					-webkit-transform: rotate( 180.001deg );
					-ms-transform: rotate( 180.001deg );
					transform: rotate( 180.001deg );
				}
			}
		}

		.devices {
			float: left;
		}

		&.is-collapsed {

			.tailor {
				margin-right: 0;
			}

			.tailor-sidebar {
				margin-left: 0;
				margin-right: -$sidebar-width;
			}

			.collapse-sidebar-arrow {

				&::before {
					-webkit-transform: rotate( 01deg );
					-ms-transform: rotate( 0deg );
					transform: rotate( 0deg );
				}
			}
		}

		// Notifications
		.notification-container {
			left: 25px;
			right: auto;
		}

		// Modal windows
		.modal__title,
		.dialog__title {
			float: right;
			padding-left: 0;
			padding-right: 14px;
		}

		.modal__controls button,
		.dialog__close {
			float: left;
		}

		.modal__footer,
		.dialog__footer {
			text-align: left;
		}
	}
}