/* Nabdh Serv / HESK admin / corrective revision 2
 * Replace the previous custom file entirely; do not append.
 * Typography and focus accents only. The original theme owns layout,
 * direction, dimensions, spacing, navigation colors and ticket statuses.
 * This is not a full RTL conversion. Requires Google Fonts connectivity.
 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@400;500;600;700&family=Tajawal:wght@400;500;700;800&display=swap');

:root {
  --nabdh-teal: #29a6a0;
  --nabdh-teal-dark: #3f4a49;
  --nabdh-teal-mid: #2b9e99;
  --nabdh-teal-light: #27afa9;
  --nabdh-teal-deep: #1a2e2d;
  --nabdh-teal-pale: #e0f2f1;
  --nabdh-paper: #f7f5f0;
  --nabdh-white: #fffdf9;
  --nabdh-line: rgba(63, 74, 73, 0.15);
  --nabdh-muted: #5f6e6c;
  --nabdh-font-text: "Noto Sans Arabic", Tahoma, Arial, sans-serif;
  --nabdh-font-heading: "Tajawal", Tahoma, Arial, sans-serif;
}

/* No font-size, line-height or font-weight overrides: retain theme metrics. */
body,
body p, body label, body small,
body li, body dt, body dd, body th, body td,
body legend, body input, body textarea, body select, body button {
  font-family: var(--nabdh-font-text) !important;
}

/* Do not overwrite icon fonts, including icons implemented as links/spans. */
body :is(a, span, div):not([class*="icon"]):not([class*="fa-"]):not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.fad):not([class*="material-"]) {
  font-family: var(--nabdh-font-text) !important;
}

body :is(h1, h2, h3, h4, h5, h6),
body :is(h1, h2, h3, h4, h5, h6) :is(a, span, strong):not([class*="icon"]):not([class*="fa-"]):not(.fa):not(.fas):not(.far):not(.fab) {
  font-family: var(--nabdh-font-heading) !important;
}

body input::placeholder, body textarea::placeholder {
  font-family: var(--nabdh-font-text) !important;
}

/* Brand accents that do not overwrite navigation or status colors. */
body input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):focus-visible,
body textarea:focus-visible,
body select:focus-visible {
  outline: 2px solid var(--nabdh-teal-mid);
  outline-offset: 2px;
}
body input[type="checkbox"], body input[type="radio"] {
  accent-color: var(--nabdh-teal-mid);
}
::selection {
  color: var(--nabdh-teal-deep);
  background-color: var(--nabdh-teal-pale);
}

/* Native form types only; do not reposition labels or reverse containers. */
body input[type="email"], body input[type="url"], body input[type="tel"] {
  direction: ltr;
  text-align: left;
}
body pre, body code, body kbd, body samp {
  font-family: Consolas, "Courier New", monospace !important;
}

html, body {
  direction: rtl;
}

/* RTL submenu correction, based on the supplied HESK admin stylesheet.
   Override physical left offsets and over-wide backgrounds only in main-menu. */
.main-menu .navbar__list ul.submenu__list {
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}
.main-menu .submenu__listitem {
  text-align: right;
}
.main-menu .submenu__listitem::before {
  left: auto;
  right: -72px;
  width: calc(100% + 72px);
  box-sizing: border-box;
  pointer-events: none;
}
.main-menu .navbar__list li .submenu__list .submenu__listitem.current::before {
  left: auto !important;
  right: -40px;
  width: 8px;
  height: 8px;
  border: 0;
}
.main-menu .listitem.submenu::after {
  right: auto;
  left: 21px;
}
.main-menu .listitem__notification {
  right: auto;
  left: 12px;
}
@media screen and (min-width: 900px) {
  .main-menu.is-toggled .listitem__menu {
    left: auto;
    right: 72px;
  }
  .main-menu.is-toggled .listitem__menu .listitem__caption,
  .main-menu.is-toggled .listitem__menu .submenu__listitem {
    padding-left: 12px;
    padding-right: 24px;
    box-sizing: border-box;
  }
}
