/* =========================================================================
   edu-frame.css - the page frame of every /Education activity (Views/Shared/_LayoutEdu.cshtml),
   2026-10-03. Light only. Docs/UI/EDUCATION_BASE.md.
   ========================================================================= */

body.edu-body {
  display: flex;
  flex-direction: column;
  height: 100vh;
  margin: 0;
  overflow: hidden;
  background: #ffffff;
  color: #101820;
  font-family: "Libre Franklin", "Segoe UI", system-ui, sans-serif;
}

/* The menu bar looks exactly as on every other SIOP page: Bootstrap's colors, and the old frame's
   "Trebuchet MS 11px" rule kept for the menu only, with zero specificity (:where) so the menu's own CSS
   wins where it does under _Layout and _LayoutSiop. */
.edu-frame-menu { flex-shrink: 0; position: relative; z-index: 10; color: #212529; background: #fff; }
:where(.edu-frame-menu) * {
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  font-size: 11px;
}
.edu-frame-menu-error { padding: 6px 12px; font-size: 12px; color: #b2452f; background: #f7f8fa; }

/* The activity fills the rest, the box _Layout gave it: each activity scrolls inside its own root. */
.edu-frame-main { flex: 1; min-height: 0; overflow: hidden; }