:root {
  --app-font-family: "Almarai", sans-serif;
}

html,
body,
button,
input,
textarea,
select,
.btn,
.form-control,
.dropdown-menu,
.modal,
.tooltip,
.popover {
  font-family: var(--app-font-family) !important;
}

.main-menu,
.main-menu .navigation,
.main-menu .navigation li,
.main-menu .navigation li a,
.main-menu .navigation li ul li a,
.menu-right,
.menu-right .menu-btn,
.menu-right .dropdown-menu,
.menu-right .dropdown-item,
.ui-menu,
.ui-menu .ui-menu-item,
.ui-menu .ui-menu-item-wrapper,
.navbar,
.navbar-nav,
.navbar-nav .nav-link,
.sidebar,
.sidebar-wrapper,
.sidebar .nav,
.sidebar .nav .nav-item,
.sidebar .nav .nav-item a,
.main-panel,
.topbar,
.dropdown-menu,
.dropdown-item {
  font-family: var(--app-font-family) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
span,
label,
small,
strong,
li,
td,
th {
  font-family: inherit;
}

.almarai-light {
  font-family: var(--app-font-family);
  font-weight: 300;
  font-style: normal;
}

.almarai-regular {
  font-family: var(--app-font-family);
  font-weight: 400;
  font-style: normal;
}

.almarai-bold {
  font-family: var(--app-font-family);
  font-weight: 700;
  font-style: normal;
}

.almarai-extrabold {
  font-family: var(--app-font-family);
  font-weight: 800;
  font-style: normal;
}