@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');

/* Magic LMS bilingual UI helpers */
.magic-language-toggle {
  margin-top: 22px;
  margin-bottom: 22px;
}

.magic-language-toggle:focus {
  color: #ffffff !important;
  text-decoration: none;
}

.magic-language-toggle__label {
  font-family: "Cairo", sans-serif !important;
  text-align: start;
}

.magic-language-toggle__icon {
  font-size: 14px;
  margin-inline-end: 10px;
}

.magic-language-toggle__label {
  font-size: 12px;
  letter-spacing: .08em;
}

.navbar_magic-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

html[dir="rtl"],
html[dir="rtl"] body {
  direction: rtl;
  text-align: right;
}

html[dir="ltr"],
html[dir="ltr"] body {
  direction: ltr;
  text-align: left;
}

html[dir="rtl"] .text_magic-left,
body.rtl .text_magic-left {
  text-align: right !important;
}

html[dir="rtl"] .text_magic-right,
body.rtl .text_magic-right {
  text-align: left !important;
}

html[dir="rtl"] .navbar_magic-nav,
body.rtl .navbar_magic-nav {
  padding-right: 0;
}

html[dir="rtl"] .navbar_magic-right,
body.rtl .navbar_magic-right {
  flex-direction: row;
}

html[dir="rtl"] .magic-language-toggle-wrap,
body.rtl .magic-language-toggle-wrap {
  margin-right: 0;
  margin-left: 10px;
}

html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
body.rtl input,
body.rtl textarea,
body.rtl select {
  direction: rtl;
  text-align: right;
}

html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
body.rtl input[type="email"],
body.rtl input[type="tel"] {
  direction: ltr;
  text-align: left;
}

html[dir="rtl"] .form-row,
body.rtl .form-row,
html[dir="rtl"] .checkbox-grid,
body.rtl .checkbox-grid,
html[dir="rtl"] .radio-group,
body.rtl .radio-group {
  direction: rtl;
}

html[dir="rtl"] .checkbox-item,
body.rtl .checkbox-item,
html[dir="rtl"] .radio-item,
body.rtl .radio-item {
  text-align: right;
}

@media (max-width: 767px) {
  .navbar_magic-right {
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
  }

                                                                .magic-language-toggle-wrap {
                                                                  margin-right: 0;
                                                                }

                                                                .magic-language-toggle {
                                                                  min-width: 62px;
                                                                  min-height: 34px;
                                                                  padding: 6px 10px;
}

@media print {
  .magic-language-toggle-wrap {
      display: none !important;
    }
}