/*
 * Mastery Grading — the jacqdesign house skin, matched to the conviviaflow
 * demo look: WHITE chrome (no colored header), warm cream sidebar, olive
 * green accents, Inter. Comprehensive on purpose: the first cut only
 * touched a few selectors and produced a mixed blue/teal hybrid.
 *
 * tokens: primary #4d7c0f · primary-dark #3f6212 · deep #166534
 *         cream #f6f7f1 · active wash #e9f0dd · ink #1f2937 · line #e5e7eb
 */
:root {
  --brand-primary: #4d7c0f;
  --brand-primary-contrast: #ffffff;
  --brand-ink: #1f2937;
  --brand-page-bg: #ffffff;
  --brand-sidebar-bg: #f6f7f1;
  --brand-chip-bg: #e2efd9;
  --brand-danger: #b3261e;
}

/* ---- type: one family everywhere ---------------------------------- */
body, h1, h2, h3, h4, h5, h6, .btn, input, select, textarea, label,
.main-header .logo, .box-title, .nav > li > a, table {
  font-family: Inter, "Segoe UI", "Source Sans Pro", sans-serif;
}

/* ---- auth / role-select screens ----------------------------------- */
.login-page, .register-page { background: #f6f7f1; }
.login-logo, .login-logo a, .register-logo { color: #1f2937; }
.login-box-body, .register-box-body { border: 1px solid #e5e7eb; border-radius: 8px; }

/* ---- header: white chrome, no colored bar ------------------------- */
.main-header .navbar { background-color: #ffffff; border-bottom: 1px solid #e5e7eb; }
.main-header .navbar .nav > li > a,
.main-header .navbar .sidebar-toggle { color: #1f2937; }
.main-header .navbar .nav > li > a:hover,
.main-header .navbar .sidebar-toggle:hover { background: #f6f7f1; color: #3f6212; }
.main-header .logo { background-color: #f6f7f1; color: #1f2937; font-weight: 700; border-bottom: 1px solid #e5e7eb; }
.main-header .logo:hover { background-color: #eef0e7; }
.main-header .navbar .nav .open > a, .main-header .navbar .nav > .active > a { background: #e9f0dd; color: #3f6212; }

/* ---- sidebar: cream, olive actives -------------------------------- */
.main-sidebar, .left-side { background-color: #f6f7f1; border-right: 1px solid #e5e7eb; }
.sidebar-menu > li > a { color: #1f2937; border-left: 3px solid transparent; }
.sidebar-menu > li.header { color: #6b7280; background: #f6f7f1; }
.sidebar-menu > li:hover > a, .sidebar-menu > li.active > a {
  color: #3f6212; background: #e9f0dd; border-left-color: #4d7c0f;
}
.sidebar-menu > li > .treeview-menu { background: #efF1e8; background: #eff1e8; }
.sidebar-menu .treeview-menu > li > a { color: #374151; }
.sidebar-menu .treeview-menu > li.active > a,
.sidebar-menu .treeview-menu > li > a:hover { color: #3f6212; font-weight: 600; }
.user-panel > .info, .user-panel > .info > a { color: #1f2937; }
.sidebar a { color: #1f2937; }

/* ---- content ------------------------------------------------------- */
.content-wrapper { background-color: #ffffff; }
a { color: #4d7c0f; }
a:hover, a:focus { color: #3f6212; }
h1, h2, h3 { color: #1f2937; }

/* ---- buttons: whole families onto the palette --------------------- */
.btn-primary, .btn-info { background-color: #4d7c0f; border-color: #3f6212; color: #fff; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-info:hover, .btn-info:focus, .btn-info:active { background-color: #3f6212; border-color: #365314; color: #fff; }
.btn-success { background-color: #166534; border-color: #14532d; }
.btn-success:hover, .btn-success:focus { background-color: #14532d; }
.btn-warning { background-color: #b45309; border-color: #92400e; color: #fff; }
.btn-warning:hover, .btn-warning:focus { background-color: #92400e; color: #fff; }
.btn-danger { background-color: #b3261e; border-color: #991b1b; }

/* ---- boxes, tabs, tables, pills ----------------------------------- */
.box { border-radius: 8px; box-shadow: none; border: 1px solid #e5e7eb; border-top-width: 1px; }
.box.box-primary, .box.box-default, .box.box-warning, .box.box-solid { border-top-color: #e5e7eb; }
.box-header { color: #1f2937; }
.nav-tabs-custom > .nav-tabs > li.active { border-top-color: #4d7c0f; }
.pagination > .active > a, .pagination > .active > a:hover,
.pagination > .active > span { background-color: #4d7c0f; border-color: #3f6212; }
.label-primary, .label-info, .bg-blue, .bg-light-blue, .bg-aqua, .bg-purple { background-color: #4d7c0f !important; }
.label-success, .bg-green { background-color: #166534 !important; }
.text-aqua, .text-light-blue, .text-blue { color: #4d7c0f !important; }
.alert-info, .callout-info { background-color: #e9f0dd !important; border-color: #4d7c0f !important; color: #1f2937 !important; }
.table > thead > tr > th { border-bottom-color: #e5e7eb; }
.progress-bar { background-color: #4d7c0f; }

/* ---- outrank the per-portal css --------------------------------------
 * teachers/admin/students/guardians.css load AFTER this skin and pin the
 * header per portal with !important (blue/cyan/green/orange -- Phoenix
 * identity). The house look wants one header everywhere: a light green
 * from the jacqdesign palette. `body` prefix + !important outranks them. */
body .user-panel, body .main-header .navbar { background-color: #e4eecf !important; }
body .main-header .logo, body .main-header li.user-header { background-color: #d6e5b3 !important; color: #1f2937 !important; }
body .main-header .navbar .nav > li > a, body .main-header .navbar .sidebar-toggle { color: #1f2937 !important; }
body .user-panel > .info, body .user-panel > .info > a { color: #1f2937 !important; }

/* ---- sidebar type: one size, one family ------------------------------
 * AdminLTE gives treeview children an explicit 14px while parents inherit
 * the 11px body size from style.css -- the two-sizes look. */
.sidebar-menu > li > a,
.sidebar-menu .treeview-menu > li > a,
.sidebar-menu > li.header {
  font-family: Inter, "Segoe UI", "Source Sans Pro", sans-serif;
  font-size: 13px;
}

/* ---- header wordmark next to the square mark ---------------------- */
.main-header .logo .logo-word {
  color: #1f2937; font-weight: 700; font-size: 16px;
  letter-spacing: -0.01em; vertical-align: middle;
}
.main-header .logo .logo-sm { vertical-align: middle; }
