/**
 * @package Helix Ultimate Framework
 * @author JoomShaper https://www.joomshaper.com
 * @copyright Copyright (c) 2010 - 2021 JoomShaper
 * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 or Later
*/

@import 'bs4-rtl';

body.rtl {
	text-align: right;

	.sp-scroll-up {
		right: auto;
		left: 30px;
	}

	.article-details {
		.link-edit-article {
			right: auto;
			left: 0;
		}
	}

	// Menu
	.sp-megamenu-parent {
		float: left;
		> li {
			&.sp-has-child > a:before,
			&.sp-has-child > span:before {
				font-family: 'Font Awesome 5 Free';
				content: '\f107';
				float: left;
				margin-right: 7px;
			}

			.sp-menu-badge {
				&.sp-menu-badge-right {
					margin-right: 7px;
				}

				&.sp-menu-badge-left {
					margin-left: 7px;
				}
			}
		}

		.sp-dropdown {
			.sp-dropdown-items {
				.sp-has-child > a:after {
					font-family: 'Font Awesome 5 Free';
					content: '\f104';
					float: left;
					margin-right: 7px;
				}
			}

			&.sp-menu-center {
				margin-right: 45px;
			}

			&.sp-dropdown-main {
				&.sp-menu-right {
					right: 0;
				}

				&.sp-menu-full {
					right: auto;
					left: 0;
				}

				&.sp-menu-left {
					left: 0;
				}
			}

			&.sp-dropdown-sub {
				right: 100%;
			}
		}
	}

	#offcanvas-toggler {
		&.offcanvas-toggler-right {
			float: left;
			margin-right: 20px;
		}

		&.offcanvas-toggler-left {
			float: right;
			margin-left: 20px;
		}
	}

	&.offcanvs-position-left {
		.body-wrapper {
			right: 0;
		}

		.offcanvas-menu {
			right: -$offcanvas_width;
		}

		&.offcanvas-active {
			.offcanvas-menu {
				right: 0;
				top: 0;
			}
			.body-wrapper {
				right: $offcanvas_width;
			}
		}
	}

	&.offcanvs-position-right {
		.body-wrapper {
			left: 0;
		}

		.offcanvas-menu {
			left: -$offcanvas_width;
		}

		&.offcanvas-active {
			.offcanvas-menu {
				left: 0;
				top: 0;
			}

			.body-wrapper {
				left: $offcanvas_width;
			}
		}
	}

	.close-offcanvas {
		left: 15px;
	}

	.offcanvas-menu {
		.offcanvas-inner {
			.sp-module {
				ul {
					> li {
						&.menu-parent {
							> a,
							> .menu-separator {
								> .menu-toggler {
									left: 0;
								}
							}
						}

						ul {
							margin-right: 10px;
						}
					}
				}
			}
		}
	}
}