/*Navbar*/
html[dir="rtl"] {
    font-family:notokufiarabic-regular !important;
}

html[dir="rtl"] header{
    direction:ltr;
}

    html[dir="rtl"] .fs-home nav ul,
    html[dir="rtl"] .fs-favorites-layout nav ul,
    html[dir="rtl"] .fs-default nav ul {
        direction: rtl;
        justify-content: flex-start;
    }

    html[dir="rtl"] .ww-favorites-links-wrapper,
    html[dir="rtl"] .fs-searchbar input {
        direction: rtl;
    }

/*Flyout Menu*/

.fs-flyout-menu-container {
    left: unset;
    right: -100%;
}

    .fs-flyout-menu-container.fs-show {
        transform: translateX(-100%);
    }

html[dir="rtl"] .fs-user-options {
    direction: rtl;
}

html[dir="rtl"] div#fs-authentication-modal{
    direction:ltr;
}

/*html[dir="rtl"] input#telephone {
    direction: rtl;
}*/

html[dir="rtl"] .iti--allow-dropdown .iti__flag-container .iti__selected-flag,
/*html[dir="rtl"] .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag */
{
    border-radius: 0 clamp(10px,1vw,20px) clamp(10px,1vw,20px) 0;
}

html[dir="rtl"] .iti--separate-dial-code input[type=tel] {
    padding-right: unset !important;
    padding-left: 29% !important;
}

html[dir=rtl] .iti--allow-dropdown .iti__flag-container, [dir=rtl] .iti--separate-dial-code .iti__flag-container {
    right: unset !important;
    left: auto;
}

html[dir="rtl"] .iti__country-list {
    right: 0;
}

/*My Profile*/

/*html[dir="rtl"] .fs-phone-login-form {
    direction: rtl;
}
*/

html[dir="rtl"] #fs-user-profile-phone {
    direction: rtl;
}

/*Home*/

html[dir="rtl"] .fs-home-container section {
    flex-direction: row-reverse;
}

    html[dir="rtl"] .fs-home-container section:nth-child(even) {
        flex-direction: row;
    }

html[dir="rtl"] .fs-exercise-generator-sidebar {
    align-items: flex-end;
}

html[dir="rtl"] .fs-exercise-generator-sidebar-option {
    flex-direction:row-reverse;
}

/*Subcategories*/

html[dir="rtl"] .fs-category-filters-container .fs-category-searchbar {
    padding-right: 20px;
    padding-left: 50px;
    background: var(--fs-white) url(/images/site/fs-search.png) no-repeat 5% center;
}

html[dir="rtl"] .fs-category-filters-container select {
    background: url(/images/site/fs-arrow-down.svg) no-repeat 5% center var(--fs-white);
}

html[dir="rtl"] .fs-workout-table td a {
    margin-left: unset;
    margin-right: 20px;
}

html[dir="rtl"] .fs-workout-details-navigation img, html[dir="rtl"] .fs-current-exercise-navigation-controls img {
    transform: rotate(180deg);
}

/*Font Change*/

html[dir="rtl"] .fs-home-page-section-title,
html[dir="rtl"] .fs-category-sub-title,
html[dir="rtl"] .fs-user-profile-form-title,
html[dir="rtl"] .fs-favorites-title,
html[dir="rtl"] .fs-category-title,
html[dir="rtl"] .fs-sub-category-title,
html[dir="rtl"] .fs-flip-card-title,
html[dir="rtl"] .fs-categories-section-title,
html[dir="rtl"] .fs-category-section-title,
html[dir="rtl"] .fs-workout-details-title,
html[dir="rtl"] .fs-workout-info-spec strong,
html[dir="rtl"] .fs-workout-weekday-title,
html[dir="rtl"] .fs-workout-table th,
html[dir="rtl"] .fs-workout-details-section-title,
html[dir="rtl"] .fs-workout-page-no,
html[dir="rtl"] .fs-diet-plans-details-title h1:nth-child(1),
html[dir="rtl"] .fs-diet-plan-day,
html[dir="rtl"] .fs-exercise-details-title h1:nth-child(1),
html[dir="rtl"] .fs-exercise-header span:first-child,
html[dir="rtl"] .fs-current-exercise-container > h1,
html[dir="rtl"] .fs-recipes-details-title h1:first-child,
html[dir="rtl"] .fs-recipes-specs {
    font-family: 'Noto Kufi Arabic';
    font-weight: bold;
}

    html[dir="rtl"] .fs-home-page-section-description,
    html[dir="rtl"] a.fs-nav-link,
    html[dir="rtl"] .fs-nav-signin-btn,
    html[dir="rtl"] .fs-primary-btn,
    html[dir="rtl"] .fs-user-options a,
    html[dir="rtl"] .fs-navbar-user-name,
    html[dir="rtl"] .fs-navbar-welcome-text,
    html[dir="rtl"] .fs-user-profile-form input,
    html[dir="rtl"] .fs-conspumption-items,
    html[dir="rtl"] .ww-favorites-links-wrapper,
    html[dir="rtl"] .fs-workout-progress-tile,
    html[dir="rtl"] .fs-cards-section-title,
    html[dir="rtl"] .fs-flip-card-description,
    html[dir="rtl"] .fs-flip-card-back-details-wrapper div,
    html[dir="rtl"] .fs-workout-info-brief-description,
    html[dir="rtl"] .fs-workout-info-description,
    html[dir="rtl"] .fs-workout-info-spec,
    html[dir="rtl"] .fs-workout-weekday-title > span,
    html[dir="rtl"] .fs-workout-weekday-description span,
    html[dir="rtl"] .fs-workout-table,
    html[dir="rtl"] .fs-diet-plans-details-title h1:nth-child(2),
    html[dir="rtl"] .fs-diet-plans-details-description,
    html[dir="rtl"] .fs-diet-plans-details-meals,
    html[dir="rtl"] .fs-exercise-details-title h1:nth-child(3),
    html[dir="rtl"] .fs-exercise-details-description,
    html[dir="rtl"] .fs-exercise-header span:last-child,
    html[dir="rtl"] .fs-exercise-footer,
    html[dir="rtl"] .fs-current-exercise-elapsed-time-wrapper,
    html[dir="rtl"] .fs-current-exercise-remaining-time-wrapper,
    html[dir="rtl"] .fs-current-exercise-navigation-wrapper,
    html[dir="rtl"] .fs-category-filters-container,
    html[dir="rtl"] .fs-recipes-details-title h1:last-child,
    html[dir="rtl"] .fs-recipes-details-description,
    html[dir="rtl"] .input-profile-labels,
    html[dir="rtl"] .fs-user-metric div,
    html[dir="rtl"] .fs-survey-summary-title,
    html[dir="rtl"] .fs-survey-recommended-bmi,
    html[dir="rtl"] .fs-survey-summary-hint,
    html[dir="rtl"] .fs-bmi-meter-value,
    html[dir="rtl"] .fs-survey-skip-btn,
    html[dir="rtl"] .fs-survey-progress-bar-container h3,
    html[dir="rtl"] .fs-survey-question-title,
    html[dir="rtl"] blockquote,
    html[dir="rtl"] .fs-survey-description,
    html[dir="rtl"] .fs-survey-question-description,
    html[dir="rtl"] .fs-survey-card-overlay,
    html[dir="rtl"] .fs-survey-answer,
    html[dir="rtl"] label {
        font-family: 'Noto Kufi Arabic';
    }

html[dir="rtl"] .fs-primary-btn {
    font-size:18px;
}

@media screen and (max-width:768px) {
    html[dir="rtl"] .fs-primary-btn {
        font-size: 14px;
    }

    html [dir="rtl"] header {
        direction: rtl;
    }

    html[dir="rtl"] .fs-exercise-generator-sidebar-icon {
        margin-left: 15px;
    }
}

@media screen and (max-width:1300px) {
    html[dir="rtl"] .iti--separate-dial-code input[type=tel] {
        padding-right: unset !important;
        padding-left: 35% !important;
    }
}

@media screen and (max-width:850px) {
    html[dir="rtl"] .iti--separate-dial-code input[type=tel] {
        padding-right: unset !important;
        padding-left: 42% !important;
    }
}