/*
FILE: app/static/css/rtl.css
DESCRIPTION: RTL (Right-to-Left) support for Hebrew and Arabic
DEVELOPER: PandaDev.com
*/

/* ============================================
   RTL BASE STYLES
   ============================================ */

body.rtl {
    direction: rtl;
    text-align: right;
}

body.rtl .container {
    direction: rtl;
}

/* ============================================
   NAVIGATION RTL
   ============================================ */

body.rtl .navbar .container {
    direction: rtl;
}

body.rtl .nav-links {
    flex-direction: row-reverse;
}

body.rtl .nav-links > li:last-child {
    margin-left: 0;
    margin-right: auto;
}

body.rtl .nav-brand {
    flex-direction: row-reverse;
}

body.rtl .nav-link {
    flex-direction: row-reverse;
}

body.rtl .nav-link i,
body.rtl .nav-link .material-icons {
    margin-left: 8px;
    margin-right: 0;
}

body.rtl .dropdown-menu {
    right: auto;
    left: 0;
}

body.rtl .dropdown-menu a {
    flex-direction: row-reverse;
}

body.rtl .dropdown-menu a i,
body.rtl .dropdown-menu a .material-icons {
    margin-left: 12px;
    margin-right: 0;
}

/* ============================================
   CARDS & GRIDS RTL
   ============================================ */

body.rtl .project-card {
    direction: rtl;
}

body.rtl .project-image .project-badges {
    left: auto;
    right: 12px;
}

body.rtl .project-meta {
    flex-direction: row-reverse;
}

body.rtl .meta-item {
    flex-direction: row-reverse;
}

body.rtl .meta-item i {
    margin-left: 4px;
    margin-right: 0;
}

/* ============================================
   FORMS RTL
   ============================================ */

body.rtl .form-control {
    direction: rtl;
    text-align: right;
}

body.rtl .form-group label {
    text-align: right;
}

body.rtl .checkbox-group {
    flex-direction: row-reverse;
}

body.rtl .checkbox-group input[type="checkbox"] {
    margin-left: 10px;
    margin-right: 0;
}

body.rtl .input-with-icon i {
    left: auto;
    right: 14px;
}

body.rtl .input-with-icon input {
    padding-left: 14px;
    padding-right: 44px;
}

/* ============================================
   BUTTONS RTL
   ============================================ */

body.rtl .btn {
    flex-direction: row-reverse;
}

body.rtl .btn i,
body.rtl .btn .material-icons {
    margin-left: 8px;
    margin-right: 0;
}

body.rtl .btn .material-icons {
    margin-left: 6px;
}

/* ============================================
   ALERTS & FLASH RTL
   ============================================ */

body.rtl .alert {
    border-left: none;
    border-right: 4px solid transparent;
    flex-direction: row-reverse;
}

body.rtl .alert .alert-content {
    flex-direction: row-reverse;
}

body.rtl .alert .alert-content i {
    margin-left: 12px;
    margin-right: 0;
}

body.rtl .alert .alert-close {
    margin-left: 0;
    margin-right: auto;
}

/* ============================================
   BREADCRUMB RTL
   ============================================ */

body.rtl .breadcrumb-modern {
    flex-direction: row-reverse;
}

body.rtl .breadcrumb-modern .separator {
    transform: scaleX(-1);
}

/* ============================================
   TABS RTL
   ============================================ */

body.rtl .tabs-header {
    flex-direction: row-reverse;
}

body.rtl .tab-btn {
    flex-direction: row-reverse;
}

body.rtl .tab-btn i {
    margin-left: 6px;
    margin-right: 0;
}

/* ============================================
   REVIEWS RTL
   ============================================ */

body.rtl .review-item .review-header {
    flex-direction: row-reverse;
}

body.rtl .review-item .reviewer {
    flex-direction: row-reverse;
}

body.rtl .review-item .reviewer .avatar {
    margin-left: 8px;
    margin-right: 0;
}

body.rtl .review-item .review-meta {
    flex-direction: row-reverse;
}

body.rtl .review-item .review-meta span {
    flex-direction: row-reverse;
}

body.rtl .review-item .review-meta i {
    margin-left: 4px;
    margin-right: 0;
}

/* ============================================
   SIDEBAR RTL
   ============================================ */

body.rtl .sidebar-info-list li {
    flex-direction: row-reverse;
}

body.rtl .sidebar-info-list li .value {
    text-align: left;
}

/* ============================================
   FOOTER RTL
   ============================================ */

body.rtl .footer-grid {
    direction: rtl;
}

body.rtl .footer-social {
    flex-direction: row-reverse;
}

body.rtl .footer-bottom {
    flex-direction: row-reverse;
}

body.rtl .footer-legal {
    flex-direction: row-reverse;
}

body.rtl .footer-legal .divider {
    margin: 0 8px;
}

/* ============================================
   LANGUAGE SWITCHER RTL
   ============================================ */

body.rtl .language-switcher {
    direction: rtl;
}

body.rtl .lang-toggle {
    flex-direction: row-reverse;
}

body.rtl .lang-toggle i {
    margin-left: 0;
    margin-right: 6px;
}

body.rtl .lang-dropdown {
    right: auto;
    left: 0;
}

body.rtl .lang-option {
    flex-direction: row-reverse;
}

body.rtl .lang-option .lang-flag {
    margin-left: 10px;
    margin-right: 0;
}

/* ============================================
   MISC RTL
   ============================================ */

body.rtl .star-rating-input {
    flex-direction: row-reverse;
}

body.rtl .star-rating-input label {
    margin: 0 2px;
}

body.rtl .hero-buttons {
    flex-direction: row-reverse;
}

body.rtl .filter-row {
    flex-direction: row-reverse;
}

body.rtl .filter-group label {
    flex-direction: row-reverse;
}

body.rtl .filter-group label i {
    margin-left: 6px;
    margin-right: 0;
}

body.rtl .filter-actions {
    flex-direction: row-reverse;
}

body.rtl .search-wrapper i {
    left: auto;
    right: 14px;
}

body.rtl .search-wrapper input {
    padding-left: 14px;
    padding-right: 40px;
}

body.rtl .pagination-modern {
    flex-direction: row-reverse;
}

body.rtl .back-nav .btn-back {
    flex-direction: row-reverse;
}

body.rtl .back-nav .btn-back i {
    margin-left: 8px;
    margin-right: 0;
}

body.rtl .profile-social {
    flex-direction: row-reverse;
}