/* NAA COLLEGE — AP/TG light-workspace integration.
   Scoped to the explicit regional light workspace. Existing logo/artwork assets are reused unchanged. */

html.light body.mos-regional-light { background:#fff !important; color:#172033 !important; }
body.mos-regional-light { background:#fff !important; color:#172033 !important; }
body.mos-regional-light #workspace-viewport { background:#fff !important; color:#172033 !important; }

/* Shared NAA COLLEGE navbar: React Header remains the single source of branding. */
html.light body.mos-regional-light #main-header,
body.mos-regional-light #main-header {
  background:#fff !important;
  color:#172033 !important;
  border-bottom-color:#e2e8f0 !important;
  box-shadow:0 4px 18px rgba(15,23,42,.06) !important;
}
html.light body.mos-regional-light #brand-logo,
body.mos-regional-light #brand-logo {
  color:#172033 !important;
  position:relative !important;
  min-width:max-content !important;
}
html.light body.mos-regional-light #brand-logo .mos-brand-mark,
body.mos-regional-light #brand-logo .mos-brand-mark {
  background:#fff !important;
  border-color:#dbe3ec !important;
  box-shadow:0 2px 8px rgba(15,23,42,.06) !important;
}
html.light body.mos-regional-light #brand-logo .mos-brand-mark img,
body.mos-regional-light #brand-logo .mos-brand-mark img {
  content:url('/MANOFSTUDY_LOGO.png') !important;
}
html.light body.mos-regional-light #brand-logo .mos-brand-wordmark,
body.mos-regional-light #brand-logo .mos-brand-wordmark {
  color:#0f172a !important;
  text-shadow:none !important;
  opacity:1 !important;
  visibility:visible !important;
}
html.light body.mos-regional-light #brand-logo .mos-brand-tagline,
body.mos-regional-light #brand-logo .mos-brand-tagline {
  color:#64748b !important;
  opacity:1 !important;
  visibility:visible !important;
}
html.light body.mos-regional-light #brand-logo:hover .mos-brand-wordmark,
body.mos-regional-light #brand-logo:hover .mos-brand-wordmark { color:#0e7490 !important; }

/* No pseudo-element branding. The React Header owns the single real tagline. */
html.light body.mos-regional-light #brand-logo::before,
html.light body.mos-regional-light #brand-logo::after,
body.mos-regional-light #brand-logo::before,
body.mos-regional-light #brand-logo::after {
  content:none !important;
  display:none !important;
}

body.mos-regional-light #mos-compact-header-nav .mos-header-link { color:#334155 !important; }
body.mos-regional-light #mos-compact-header-nav .mos-header-link:hover {
  color:#0e7490 !important;
  background:rgba(14,116,144,.08) !important;
}
body.mos-regional-light .mos-tools-dropdown {
  background:#fff !important;
  border-color:#d7dee8 !important;
  box-shadow:0 18px 42px rgba(15,23,42,.12) !important;
}
body.mos-regional-light .mos-tools-dropdown a { color:#334155 !important; }
body.mos-regional-light .mos-tools-dropdown a:hover {
  color:#0e7490 !important;
  background:rgba(14,116,144,.08) !important;
}
body.mos-regional-light #header-command-palette-trigger,
body.mos-regional-light #header-support-btn {
  color:#334155 !important;
  background:#fff !important;
  border-color:#d7dee8 !important;
}
body.mos-regional-light #header-command-palette-trigger:hover,
body.mos-regional-light #header-support-btn:hover {
  color:#0e7490 !important;
  background:#f0f9ff !important;
}

/* Regional hero shell. The supplied AP/TG artwork has a pure-white background,
   so the containing hero surface is also pure white to eliminate the visible rectangle. */
body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) header {
  position:relative !important;
  overflow:visible !important;
  background:#fff !important;
  color:#172033 !important;
}
body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) .mos-regional-title-block {
  position:relative !important;
  min-height:184px !important;
  padding-right:250px !important;
  padding-top:42px !important;
  box-sizing:border-box !important;
  background:#fff !important;
  color:#172033 !important;
}
body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) header button[title="Return to Naa College Feature Hub"] {
  position:absolute !important;
  top:20px !important;
  left:24px !important;
  z-index:6 !important;
  margin:0 !important;
  white-space:nowrap !important;
  color:#334155 !important;
  background:#fff !important;
  border-color:#d7dee8 !important;
}

/* Existing AP/TG artwork only. Do not alter the image asset itself. */
body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) #mos-regional-workspace-visual {
  position:absolute !important;
  z-index:5 !important;
  top:50% !important;
  right:0 !important;
  transform:translateY(-50%) !important;
  width:228px !important;
  max-width:30vw !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  border:0 !important;
  border-radius:0 !important;
  background:#fff !important;
  overflow:visible !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  pointer-events:none !important;
}
body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) .mos-regional-visual-frame {
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
  display:block !important;
  border-radius:0 !important;
  background:#fff !important;
}
body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) .mos-regional-visual-image {
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  opacity:1 !important;
  border-radius:0 !important;
  filter:none !important;
}

/* AP/TG-only contrast protection. */
body.mos-regional-light #workspace-viewport [class*="bg-slate-950"],
body.mos-regional-light #workspace-viewport [class*="bg-slate-900"],
body.mos-regional-light #workspace-viewport [class*="bg-slate-800"],
body.mos-regional-light #workspace-viewport [class*="bg-slate-700"],
body.mos-regional-light #workspace-viewport [class*="bg-gray-950"],
body.mos-regional-light #workspace-viewport [class*="bg-gray-900"],
body.mos-regional-light #workspace-viewport [class*="bg-gray-800"],
body.mos-regional-light #workspace-viewport [class*="bg-black"] { background:#fff !important; }
body.mos-regional-light #workspace-viewport [class*="text-white"],
body.mos-regional-light #workspace-viewport [class*="text-slate-50"],
body.mos-regional-light #workspace-viewport [class*="text-slate-100"],
body.mos-regional-light #workspace-viewport [class*="text-slate-200"],
body.mos-regional-light #workspace-viewport [class*="text-slate-300"],
body.mos-regional-light #workspace-viewport [class*="text-gray-50"],
body.mos-regional-light #workspace-viewport [class*="text-gray-100"],
body.mos-regional-light #workspace-viewport [class*="text-gray-200"],
body.mos-regional-light #workspace-viewport [class*="text-gray-300"] { color:#172033 !important; }
body.mos-regional-light #workspace-viewport [class*="text-slate-400"],
body.mos-regional-light #workspace-viewport [class*="text-slate-500"],
body.mos-regional-light #workspace-viewport [class*="text-gray-400"],
body.mos-regional-light #workspace-viewport [class*="text-gray-500"] { color:#526071 !important; }
body.mos-regional-light #workspace-viewport [class*="border-slate-"],
body.mos-regional-light #workspace-viewport [class*="border-gray-"],
body.mos-regional-light #workspace-viewport [class*="border-white"] { border-color:#d7dee8 !important; }
body.mos-regional-light #workspace-viewport input,
body.mos-regional-light #workspace-viewport select,
body.mos-regional-light #workspace-viewport textarea {
  background:#fff !important;
  color:#172033 !important;
  border-color:#cbd5e1 !important;
  caret-color:#172033 !important;
}
body.mos-regional-light #workspace-viewport input::placeholder,
body.mos-regional-light #workspace-viewport textarea::placeholder { color:#64748b !important; opacity:1 !important; }
body.mos-regional-light #workspace-viewport select option { background:#fff !important; color:#172033 !important; }
body.mos-regional-light #workspace-viewport input:focus,
body.mos-regional-light #workspace-viewport select:focus,
body.mos-regional-light #workspace-viewport textarea:focus {
  outline:2px solid rgba(14,116,144,.22) !important;
  outline-offset:1px !important;
  border-color:#0e7490 !important;
}
body.mos-regional-light #workspace-viewport button { color:#172033; }
body.mos-regional-light #workspace-viewport a { color:#075985; }
body.mos-regional-light #workspace-viewport [aria-selected="false"] { color:#334155 !important; }
body.mos-regional-light #workspace-viewport [aria-selected="true"] { color:#0f172a !important; }
body.mos-regional-light #workspace-viewport table { color:#172033 !important; }
body.mos-regional-light #workspace-viewport th,
body.mos-regional-light #workspace-viewport td { border-color:#e2e8f0 !important; }

@media (max-width:1000px) and (min-width:641px) {
  body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) .mos-regional-title-block {
    min-height:165px !important;
    padding-right:195px !important;
  }
  body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) #mos-regional-workspace-visual {
    width:175px !important;
    max-width:32vw !important;
  }
}

@media (max-width:640px) {
  body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) .mos-regional-title-block {
    min-height:0 !important;
    padding-right:0 !important;
    padding-top:42px !important;
    padding-bottom:132px !important;
  }
  body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) header button[title="Return to Naa College Feature Hub"] {
    top:14px !important;
    left:16px !important;
    max-width:calc(100% - 32px) !important;
    padding:8px 11px !important;
    font-size:11px !important;
  }
  body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) #mos-regional-workspace-visual {
    top:auto !important;
    bottom:0 !important;
    right:50% !important;
    transform:translateX(50%) !important;
    width:132px !important;
    max-width:52vw !important;
    height:auto !important;
  }
}

@media (max-width:390px) {
  body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) .mos-regional-title-block { padding-bottom:122px !important; }
  body.mos-regional-light #workspace-viewport:has(#mos-regional-workspace-visual) #mos-regional-workspace-visual {
    width:112px !important;
    max-width:48vw !important;
  }
}

/* AP/TG header parity fix v2 */
/* Header.tsx is the single source of truth. SiteUxFixes may still carry the legacy
   compact-nav injector, so hide that retired duplicate rather than creating a
   second navigation system. */
#mos-compact-header-nav { display:none !important; }

/* AP/TG use the real React Header dropdowns. Convert those dropdown surfaces to
   the same light palette and keep every menu label readable. */
body.mos-regional-light #main-header nav[aria-label="Primary navigation"] > div > div.absolute {
  background:#fff !important;
  border-color:#d7dee8 !important;
  box-shadow:0 18px 42px rgba(15,23,42,.12) !important;
  color:#172033 !important;
}
body.mos-regional-light #main-header nav[aria-label="Primary navigation"] > div > div.absolute button {
  color:#334155 !important;
}
body.mos-regional-light #main-header nav[aria-label="Primary navigation"] > div > div.absolute button:hover {
  color:#0e7490 !important;
  background:#f0f9ff !important;
}
body.mos-regional-light #main-header nav[aria-label="Primary navigation"] > div > div.absolute span {
  color:inherit !important;
}

/* Mobile AP/TG navigation must use the same readable light surface. */
body.mos-regional-light #main-header > div + div {
  background:#fff !important;
  color:#172033 !important;
  border-top-color:#e2e8f0 !important;
}
body.mos-regional-light #main-header > div + div button {
  color:#334155 !important;
}
body.mos-regional-light #main-header > div + div button:hover {
  color:#0e7490 !important;
  background:#f0f9ff !important;
}
