@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&family=El+Messiri:wght@500;600;700&display=swap');

/* Two families with two jobs:
   El Messiri carries the brand on titles, Cairo does the reading work.
   El Messiri on paragraphs and numbers is tiring and its digits are narrow. */

:root {
   --font-heading-ar: 'El Messiri', 'Cairo', sans-serif;
   --font-body-ar: 'El Messiri', 'Cairo', sans-serif;
   /*--font-body-ar: 'Cairo', 'Segoe UI', sans-serif;*/
}

* {
   font-family: var(--font-body-ar);
}

body {
   font-family: var(--font-body-ar);
   direction: rtl;
   text-align: right;
   font-size: 16px;
   line-height: 1.9;          /* arabic needs more leading than latin */
   letter-spacing: 0;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

p, span, li, a, strong, label, input, textarea, select, button, td, th {
   font-family: var(--font-body-ar) !important;
}

p {
   line-height: 1.95;
}

h1, h2, h3, h4, h5, h6,
.title, .rbt-title-style-2, .rbt-title-style-3, .rbt-card-title, .modal-title {
   font-family: var(--font-heading-ar) !important;
   font-weight: 600;
   line-height: 1.6;
}

h1, h2, h3 {
   font-weight: 700;
}

/* Latin digits and dates keep Cairo, it has proper tabular numerals */
.min-lable, .rbt-badge-5, .current-price, .odometer,
time, .breadcrumb-item, .rbt-meta li {
   font-family: var(--font-body-ar) !important;
   font-feature-settings: 'tnum';
}

/* Buttons read better a touch tighter than body copy */
.rbt-btn, .btn {
   line-height: 1.6;
   font-weight: 600;
}

.search-field .serach-btn {
   left: 0px;
   right: initial;
}

.rbt-category-menu-wrapper .category-dropdown-menu .category-menu-item .rbt-vertical-nav-list-wrapper li,
.rbt-header .mainmenu-nav .mainmenu li {
   text-align: right;
}

.rbt-header .mainmenu-nav .mainmenu li:first-child a {
   padding-right: 0px;
   padding-left: initial;
}

.feather-arrow-right:before {
    content: "\e910";
}

.rbt-btn.icon-hover .btn-icon i {
   padding-right: 0px;
   padding-left: initial;
}

.newsletter-form-1 input {
   padding-left: 172px;
   padding-right: 50px;
}

.newsletter-form-1 .rbt-btn {
   left: 10px;
   right: initial;
}

[type=email], [type=number], [type=tel], [type=url] {
   direction: rtl;
}

.feather-chevron-right:before {
    content: "\e933";
}

/* An icon sitting before arabic text needs a gap on its left.
   This used to be a blanket `i { margin-left: 5px }`, which also nudged every
   icon that is centred on its own — inside round buttons, badges, players and
   the accordion arrows — leaving them visibly off centre. Only give the gap to
   icons that actually sit next to text. */
li > i,
p > i,
label > i,
td > i,
th > i,
h1 > i, h2 > i, h3 > i, h4 > i, h5 > i, h6 > i,
.rbt-meta li i,
.rbt-badge i,
.rbt-badge-2 i,
.rbt-badge-5 i,
.breadcrumb-item i,
.alert > i,
.menu-link > i {
   margin-left: 5px;
}

/* Anything meant to be centred keeps its own box */
.rbt-round-btn i,
.rbt-btn i,
.btn i,
.social-icon li a i,
.hamberger-button i,
.rbt-close-offcanvas i,
.search-btn i,
.plyr i,
.accordion-button::after,
.rbt-header-bell i,
.bell-toast-icon i,
.rbt-notification-icon i,
.stat-icon i,
.rbt-round-icon i,
.course-lock i,
.rbt-check i {
   margin-left: 0;
}

.position-static {
   padding: 0px 5px;
}

i {
    margin: 0px 5px;
}

.rbt-meta li i {
    float: right;
}

.icon-reverse-wrapper {
    top: 30%;
}

.rbt-card .rbt-card-body .rbt-card-title a {
    font-size: 18px;
}

.rbt-breadcrumb-default .title {
    font-size: 26px;
}