/* WDT lessons (MemberPress Courses classroom). Palette from FDA Master Reference v9.0 section 2.3.
   Gold is the only accent. All colours are variables; no hex outside this block. v1.0 */
body.mpcs-classroom,
body.single-mpcs-course {
  --gold: #C4A44A;
  --gold-light: #D4B96A;
  --gold-pale: #EDD98A;
  --navy: #2A2318;
  --navy-mid: #332C1F;
  --navy-dark: #1A150E;
  --cream: #F7F3ED;
  --cream-dark: #EDE7DC;
  --cream-border: #E0D8CC;
  --white: #FFFFFF;
  --text-dark: #1C1C1C;
  --text-mid: #4A4A4A;
  --text-light: #888888;
  --gold-tint: rgba(196, 164, 74, 0.14);
  font-family: 'Jost', sans-serif;
  color: var(--text-dark);
  background: var(--cream);
}

/* ---------- top bar ---------- */
body.mpcs-classroom #mpcs-navbar { background: var(--navy); border-bottom: 1px solid var(--navy-dark); }
body.mpcs-classroom #mpcs-navbar a { font-family: 'Jost', sans-serif; text-decoration: none; }
body.mpcs-classroom #mpcs-navbar .navbar-brand { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 22px; color: var(--white); letter-spacing: 0.02em; }
body.mpcs-classroom #mpcs-navbar .nav-back,
body.mpcs-classroom #mpcs-navbar .nav-back i { color: var(--gold); }
body.mpcs-classroom #mpcs-navbar .nav-back:hover i { color: var(--gold-light); }
body.mpcs-classroom #mpcs-classroom-previous-lesson-link {
  background: var(--navy); color: var(--white); font-size: 12px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase;
}
body.mpcs-classroom #mpcs-classroom-previous-lesson-link:hover { color: var(--gold); background: var(--navy-mid); }
body.mpcs-classroom #mpcs-classroom-next-lesson-link {
  background: var(--gold); color: var(--navy-dark); font-size: 12px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase;
}
body.mpcs-classroom #mpcs-classroom-next-lesson-link:hover { background: var(--gold-light); color: var(--navy-dark); }
body.mpcs-classroom #mpcs-navbar .sidebar-open { color: var(--gold); }

/* ---------- sidebar ---------- */
body.mpcs-classroom #mpcs-sidebar { background: var(--cream-dark); border-right: 1px solid var(--cream-border); font-family: 'Jost', sans-serif; }
body.mpcs-classroom #mpcs-sidebar-header h2 { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 24px; color: var(--navy); }
body.mpcs-classroom #mpcs-sidebar .progress-bar { background: var(--cream-border); }
body.mpcs-classroom #mpcs-sidebar .progress-bar > *,
body.mpcs-classroom #mpcs-sidebar .progress-bar .progress { background: var(--gold); }
body.mpcs-classroom #mpcs-sidebar .progress-text { color: var(--text-mid); font-size: 12px; letter-spacing: 0.14em; }
body.mpcs-classroom #mpcs-sidebar .progress-text b,
body.mpcs-classroom #mpcs-sidebar .progress-text strong { color: var(--navy); }

body.mpcs-classroom .mpcs-section-header { background: var(--cream-border); color: var(--navy); font-family: 'Jost', sans-serif; font-weight: 500; letter-spacing: 0.04em; }
body.mpcs-classroom .mpcs-section-header:hover,
body.mpcs-classroom .mpcs-section-header[aria-expanded="true"] { background: var(--cream-border); color: var(--navy); }
body.mpcs-classroom .mpcs-section-title-text { font-family: 'Jost', sans-serif; font-weight: 500; font-size: 15px; color: var(--navy); }
body.mpcs-classroom .mpcs-lesson { background: transparent; }
body.mpcs-classroom .mpcs-lesson a.mpcs-lesson-row-link,
body.mpcs-classroom .mpcs-lesson .mpcs-lesson-link { color: var(--text-mid); font-family: 'Jost', sans-serif; font-weight: 400; font-size: 16px; }
body.mpcs-classroom .mpcs-lesson a.mpcs-lesson-row-link:hover,
body.mpcs-classroom .mpcs-lesson a.mpcs-lesson-row-link:hover .mpcs-lesson-link { color: var(--gold); }
body.mpcs-classroom .mpcs-lesson.current { background: var(--gold-tint); box-shadow: inset 3px 0 0 var(--gold); }
body.mpcs-classroom .mpcs-lesson.current .mpcs-lesson-link { color: var(--navy); font-weight: 500; }
body.mpcs-classroom .mpcs-lesson-progress,
body.mpcs-classroom .mpcs-lesson-progress span,
body.mpcs-classroom .mpcs-lesson-progress i { color: var(--gold); border-color: var(--gold); }
body.mpcs-classroom .mpcs-lesson-progress .mpcs-lesson-complete,
body.mpcs-classroom .mpcs-lesson-progress .mpcs-lesson-complete i { background: var(--gold); color: var(--white); }
body.mpcs-classroom .mpcs-lesson-icon { color: var(--text-light); }

/* ---------- main content ---------- */
body.mpcs-classroom #mpcs-main { background: var(--cream); font-family: 'Jost', sans-serif; color: var(--text-dark); }
body.mpcs-classroom #mpcs-main .entry-title { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 42px; line-height: 1.15; color: var(--navy); margin: 8px 0 24px; }
body.mpcs-classroom #mpcs-main .entry-title i { color: var(--gold); }
body.mpcs-classroom #mpcs-main .mpcs-main-content { max-width: 880px; font-size: 17px; font-weight: 300; line-height: 1.8; color: var(--text-dark); }
body.mpcs-classroom #mpcs-main a { color: var(--gold); text-decoration: none; }
body.mpcs-classroom #mpcs-main a:hover { color: var(--gold-light); }
body.mpcs-classroom #mpcs-main p { margin: 0 0 16px; }

.wdt-video { margin: 0 0 32px; }
.wdt-video iframe { max-width: 100%; }

.wdt-keynotes { background: var(--white); border: 1px solid var(--cream-border); padding: 30px 36px; margin: 0 0 24px; }
.wdt-tip { background: var(--navy); color: var(--white); padding: 30px 36px; margin: 0 0 32px; text-align: center; }
.wdt-box-title { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 24px; letter-spacing: 0.14em; text-transform: uppercase; text-align: center; color: var(--gold); margin: 0 0 18px !important; }
.wdt-role { font-family: 'Jost', sans-serif; font-weight: 600; font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); margin: 24px 0 10px !important; }
.wdt-keynotes .wdt-role:first-of-type { margin-top: 0 !important; }
.wdt-keynotes ul { margin: 0 0 8px 1.2em; padding: 0; }
.wdt-keynotes li { font-size: 17px; font-weight: 300; line-height: 1.7; margin: 0 0 10px; color: var(--text-dark); }
.wdt-tip p { color: var(--white); font-size: 17px; font-weight: 300; margin: 0; }

/* free-form lesson pages (Getting Started, Draft Your Choreography, The Choreography) */
.wdt-body h3 { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 32px; color: var(--navy); margin: 40px 0 14px; }
.wdt-body h4, .wdt-body h5, .wdt-body h6 { font-family: 'Jost', sans-serif; font-weight: 500; font-size: 18px; color: var(--navy); margin: 28px 0 10px; }
.wdt-body .wdt-accent { font-family: 'Jost', sans-serif; font-weight: 600; font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold); margin: 36px 0 12px; }
.wdt-body h3.wdt-accent { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 32px; letter-spacing: 0; text-transform: none; color: var(--gold); }
.wdt-body ul, .wdt-body ol { margin: 0 0 20px 1.2em; padding: 0; }
.wdt-body li { margin: 0 0 8px; }
.wdt-body img { max-width: 100%; height: auto; }
.wdt-form { margin: 28px 0 0; }
.wdt-form iframe { width: 100%; border: 0; }

/* overrides for the plugin's own classroom styles */
body.mpcs-classroom #mpcs-navbar,
body.mpcs-classroom #mpcs-navbar .navbar-section,
body.mpcs-classroom #mpcs-lesson-navigation { background: var(--navy) !important; }
body.mpcs-classroom #mpcs-classroom-previous-lesson-link { background: var(--navy) !important; color: var(--white) !important; }
body.mpcs-classroom #mpcs-classroom-next-lesson-link { background: var(--gold) !important; color: var(--navy-dark) !important; }
body.mpcs-classroom #mpcs-classroom-next-lesson-link:hover { background: var(--gold-light) !important; }
body.mpcs-classroom #mpcs-sidebar-header,
body.mpcs-classroom .mpcs-sidebar-wrapper { background: transparent !important; }
body.mpcs-classroom #mpcs-main .entry-title,
body.mpcs-classroom #mpcs-main .mpcs-main-content { max-width: 900px; margin-left: auto; margin-right: auto; }
.wdt-tip .wdt-box-title { color: var(--gold); }
/* The popup plugin prints its popups on the classroom page without its own stylesheet (a huge black icon). Marketing popups do not belong in a lesson. */
body.mpcs-classroom .pum-overlay,
body.mpcs-classroom .pum-container,
body.mpcs-classroom .tvd-toast { display: none !important; }

@media (max-width: 600px) {
  body.mpcs-classroom #mpcs-main .entry-title { font-size: 32px; }
  .wdt-keynotes, .wdt-tip { padding: 22px 20px; }
}