/* ===========================================================================
   ManpowerIQ wiki brand — Phase 10 navy-first restyle.
   Tokens extracted from manpoweriq/web/src/index.css (MIQ-160 navy-first).
   Brand = navy #082B5F; orange #F97316 is CTA/highlight-only (Material accent).
   App is light-only; the slate (dark) scheme is DERIVED from the app's navy hues.
   =========================================================================== */

/* App fonts — same @import the app uses (Inter Latin + Cairo Arabic/RTL) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Cairo:wght@400;600;700&display=swap');

/* ---- Primary (header) — navy in both schemes ---- */
[data-md-color-primary="custom"] {
  --md-primary-fg-color:        #082B5F;
  --md-primary-fg-color--light: #174A8B;
  --md-primary-fg-color--dark:  #03152F;
  --md-primary-bg-color:        #FFFFFF;
  --md-primary-bg-color--light: #E8F1FB;
}

/* ---- Accent — the one reserved orange (links hover / interactive) ---- */
[data-md-color-accent="custom"] {
  --md-accent-fg-color:             #F97316;
  --md-accent-fg-color--transparent: rgba(249, 115, 22, 0.10);
}

/* ---- LIGHT (default) scheme ---- */
[data-md-color-scheme="default"] {
  --md-default-bg-color:          #F6F9FD;  /* page */
  --md-default-fg-color:          #0F172A;  /* ink */
  --md-default-fg-color--light:   #64748B;
  --md-default-fg-color--lighter: #94A3B8;
  --md-default-fg-color--lightest:#D8E4F2;
  --md-typeset-color:             #0F172A;
  --md-typeset-a-color:           #174A8B;  /* navy-mid links; hover→orange via accent */
  --md-code-bg-color:             #F8FBFF;
  --md-code-fg-color:             #0F172A;
  --md-footer-bg-color:           #082B5F;
  --md-footer-bg-color--dark:     #03152F;
}

/* ---- DARK (slate) scheme — derived navy-dark from the app palette ---- */
[data-md-color-scheme="slate"] {
  --md-default-bg-color:          #03152F;  /* brand-dark */
  --md-default-bg-color--light:   #082B5F;
  --md-default-bg-color--lighter: #0A2147;
  --md-default-fg-color:          #E8F1FB;  /* brand-light */
  --md-default-fg-color--light:   #B7C9E2;
  --md-default-fg-color--lighter: #94A3B8;
  --md-default-fg-color--lightest:#3A4F73;
  --md-typeset-color:             #E8F1FB;
  --md-typeset-a-color:           #6BA6F0;  /* light navy link on dark */
  --md-code-bg-color:             #0A2147;
  --md-code-fg-color:             #E8F1FB;
  --md-footer-bg-color:           #03152F;
  --md-footer-bg-color--dark:     #020E20;
}

/* ---- Navy left sidebar (the app's signature surface), both schemes ---- */
/* ONLY the primary (left) sidebar is navy. The secondary (right TOC) is left
   alone so it keeps dark ink on the light content. */
.md-sidebar--primary {
  background-color: #082B5F;
  /* Material colors nav links via THESE variables, not a direct `color` —
     override them here so resting links inherit near-white instead of the
     navy-mid link color. This is what actually wins the cascade. */
  --md-typeset-a-color: #E8F1FB;
  --md-default-fg-color: #E8F1FB;
  --md-default-fg-color--light: #E8F1FB;
  --md-default-fg-color--lighter: #E8F1FB;   /* was 0.7 → dimmed the integrated sub-TOC + collapsed items */
}
/* Foreground → near-white on navy. !important so it wins over the scheme's
   link/typeset colors (the resting nav links were inheriting navy-mid #174A8B,
   i.e. navy-on-navy). Covers labels, section titles, ellipsis, chevrons. */
.md-sidebar--primary .md-nav,
.md-sidebar--primary .md-nav__title,
.md-sidebar--primary .md-nav__link,
.md-sidebar--primary label.md-nav__link,
.md-sidebar--primary .md-nav__link .md-ellipsis,
.md-sidebar--primary .md-nav__item {
  color: #E8F1FB !important;
  opacity: 1 !important;            /* override Material's ~0.6 dimming → crisp, not translucent */
}
/* collapse/expand chevrons + nav icons → near-white (mask-image follows color) */
.md-sidebar--primary .md-nav__icon,
.md-sidebar--primary .md-nav__icon::after,
.md-sidebar--primary .md-nav__link svg {
  color: #E8F1FB !important;
  fill: currentColor;
  opacity: 1 !important;
}
/* hover/focus → brighter white */
.md-sidebar--primary .md-nav__link:hover,
.md-sidebar--primary .md-nav__link:focus,
.md-sidebar--primary .md-nav__link:hover .md-ellipsis {
  color: #FFFFFF !important;
  opacity: 1 !important;
}
/* active item: brighter white + the one reserved orange indicator stripe */
.md-sidebar--primary .md-nav__link--active,
.md-sidebar--primary .md-nav__item--active > .md-nav__link,
.md-sidebar--primary .md-nav__link--active .md-ellipsis {
  color: #FFFFFF !important;
  font-weight: 600;
}
.md-sidebar--primary .md-nav__link--active {
  border-inline-start: 3px solid #F97316;
  padding-inline-start: 0.4rem;
}

/* ---- Fonts (theme.font disabled in mkdocs.yml; controlled here) ---- */
body, input, .md-typeset {
  font-family: "Inter", system-ui, -apple-system, sans-serif;
}
.md-typeset code, .md-typeset pre, code, kbd, pre {
  font-family: ui-monospace, "SFMono-Regular", "Roboto Mono", "Cascadia Code", monospace;
}
/* Arabic / RTL pages → Cairo (matches the app's html[dir=rtl] rule) */
[dir="rtl"] body, [dir="rtl"] .md-typeset, :lang(ar), [lang="ar"] .md-typeset {
  font-family: "Cairo", Tahoma, Arial, sans-serif;
}

/* ---- Shape: app radius 0.5rem (8px) on the key surfaces ---- */
.md-typeset pre > code,
.md-typeset > .highlight,
.md-typeset .admonition,
.md-typeset details,
.md-typeset table:not([class]),
.md-typeset .tabbed-set {
  border-radius: 0.5rem;
}

/* =========================================================
   FIX PACK: MkDocs Material sidebar CSS fixes for uploaded static site
   Purpose:
   - Remove white block / white shadow at top of left sidebar
   - Keep left navigation navy and readable
   - Keep integrated page TOC readable when toc.integrate exists in the build
   ========================================================= */

/* Full left sidebar navy surface */
.md-sidebar--primary,
.md-sidebar--primary .md-sidebar__scrollwrap,
.md-sidebar--primary .md-sidebar__inner,
.md-sidebar--primary .md-nav,
.md-sidebar--primary .md-nav__title,
.md-sidebar--primary .md-nav__list,
.md-sidebar--primary .md-nav__item,
.md-sidebar--primary .md-nav__link {
  background-color: #082B5F !important;
}

/* Remove white fade / shadow pseudo-elements from sidebar scroll area */
.md-sidebar--primary .md-sidebar__scrollwrap::before,
.md-sidebar--primary .md-sidebar__scrollwrap::after,
.md-sidebar--primary .md-nav__title::before,
.md-sidebar--primary .md-nav__title::after,
.md-sidebar--primary .md-nav::before,
.md-sidebar--primary .md-nav::after {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Remove remaining shadows/borders that create the white top block */
.md-sidebar--primary,
.md-sidebar--primary *,
.md-sidebar--primary *::before,
.md-sidebar--primary *::after {
  box-shadow: none !important;
}

/* Left sidebar title / back title */
.md-sidebar--primary .md-nav__title,
.md-sidebar--primary .md-nav__title[for="__drawer"],
.md-sidebar--primary .md-nav__title[for="__toc"] {
  background: #082B5F !important;
  color: #E8F1FB !important;
  border: 0 !important;
}

/* Left sidebar text and icons */
.md-sidebar--primary .md-nav,
.md-sidebar--primary .md-nav__link,
.md-sidebar--primary label.md-nav__link,
.md-sidebar--primary .md-nav__link .md-ellipsis,
.md-sidebar--primary .md-nav__item,
.md-sidebar--primary .md-nav__icon,
.md-sidebar--primary .md-nav__icon::after,
.md-sidebar--primary .md-nav__link svg,
.md-sidebar--primary .md-status {
  color: #E8F1FB !important;
  opacity: 1 !important;
}

/* Active / hover */
.md-sidebar--primary .md-nav__link:hover,
.md-sidebar--primary .md-nav__link:focus,
.md-sidebar--primary .md-nav__link--active,
.md-sidebar--primary .md-nav__item--active > .md-nav__link,
.md-sidebar--primary .md-nav__link--active .md-ellipsis {
  color: #FFFFFF !important;
  opacity: 1 !important;
}

.md-sidebar--primary .md-nav__link--active {
  border-inline-start: 3px solid #F97316 !important;
  padding-inline-start: 0.4rem !important;
}

/* Section labels */
.md-sidebar--primary .md-nav__item--section > .md-nav__link,
.md-sidebar--primary .md-nav__item--section > .md-nav__link .md-ellipsis {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* Search elements if rendered inside drawer/sidebar */
.md-sidebar--primary .md-search,
.md-sidebar--primary .md-search__form,
.md-sidebar--primary .md-search__input,
.md-sidebar--primary .md-search__output,
.md-sidebar--primary .md-search__scrollwrap,
.md-sidebar--primary input {
  background: #082B5F !important;
  color: #E8F1FB !important;
  box-shadow: none !important;
}

.md-sidebar--primary input::placeholder {
  color: rgba(232, 241, 251, 0.75) !important;
}

/* If this static build still contains toc.integrate, make the integrated TOC readable */
.md-sidebar--primary .md-nav--secondary,
.md-sidebar--primary .md-nav--secondary .md-nav__title,
.md-sidebar--primary .md-nav--secondary .md-nav__list,
.md-sidebar--primary .md-nav--secondary .md-nav__item,
.md-sidebar--primary .md-nav--secondary .md-nav__link {
  background: #082B5F !important;
  color: #E8F1FB !important;
}

.md-sidebar--primary .md-nav--secondary {
  margin-top: 0.25rem !important;
  margin-bottom: 0.5rem !important;
  border-inline-start: 1px solid rgba(232, 241, 251, 0.28) !important;
}

.md-sidebar--primary .md-nav--secondary .md-nav__title {
  display: none !important;
}

.md-sidebar--primary .md-nav--secondary .md-nav__link {
  font-size: 0.72rem !important;
  padding-top: 0.18rem !important;
  padding-bottom: 0.18rem !important;
  color: rgba(232, 241, 251, 0.86) !important;
}

.md-sidebar--primary .md-nav--secondary .md-nav__link:hover,
.md-sidebar--primary .md-nav--secondary .md-nav__link--active {
  color: #FFFFFF !important;
}

/* Mobile drawer consistency */
.md-nav--primary,
.md-nav--primary .md-nav__title,
.md-nav--primary .md-nav__list {
  background-color: #082B5F !important;
}