/* Riskpro LMS — self-contained (no dependency on camp-suite's
   course-hub.css), using the same brand palette so a page combining both
   plugins' output still reads as one system: "similar looking UI". */

.rlms-course, .rlms-pub{
  --navy:#392D7D; --gold:#F1B51C; --cherry:#E31F26; --text:#231F20; --text-2:#5c5763; --border:#e6e3ee; --surface:#f7f6fb;
  font-family:'Roboto',-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--text); font-size:16px; line-height:1.7; max-width:1600px; width:100%; margin:0 auto 32px; padding:8px 20px;
}
.rlms-course *, .rlms-pub *{box-sizing:border-box;}

/* ---------- host theme chrome cleanup (course + lesson pages only) ----------
   Same tagDiv/Newspaper-theme cleanup camp-suite's course-hub.css already
   applies to the CAMP course page (breadcrumb, byline/date row, footer
   tags/sharing/next-prev, author box, Products sidebar widget) — repeated
   here scoped to this plugin's own post types so a Riskpro LMS course page
   reads the same way. */
body.single-rlms_course .td-crumb-container,
body.single-rlms_lesson .td-crumb-container,
body.single-rlms_course article > .td-post-header .td-module-meta-info,
body.single-rlms_lesson article > .td-post-header .td-module-meta-info,
body.single-rlms_course article > footer .td-post-source-tags,
body.single-rlms_lesson article > footer .td-post-source-tags,
body.single-rlms_course .td-post-sharing-top,
body.single-rlms_lesson .td-post-sharing-top,
body.single-rlms_course article > footer .td-post-sharing-bottom,
body.single-rlms_lesson article > footer .td-post-sharing-bottom,
body.single-rlms_course article > footer .td-post-next-prev,
body.single-rlms_lesson article > footer .td-post-next-prev,
body.single-rlms_course article > footer .author-box-wrap,
body.single-rlms_lesson article > footer .author-box-wrap,
body.single-rlms_course .td-pb-span4.td-main-sidebar,
body.single-rlms_lesson .td-pb-span4.td-main-sidebar{
  display:none !important;
}
body.single-rlms_course .td-pb-span8.td-main-content,
body.single-rlms_lesson .td-pb-span8.td-main-content{
  width:100% !important;
}
/* The actual bottleneck (found by inspecting the live site's computed
   styles, not guessed): tagDiv/Newspaper sets a literal `width` (not
   `max-width`) on .td-container at each of its own responsive
   breakpoints — e.g. "width:1068px" at a 1280px viewport — regardless of
   what class the page template also puts on that element
   (.td-post-template-default, .tdc-content-wrap, etc. all get the same
   fixed width). A max-width override doesn't beat a plain width rule, so
   this has to override `width` itself, with !important, on the general
   .td-container selector — scoped to these two body classes so nothing
   else on the site is affected. */
body.single-rlms_course .td-main-content-wrap .td-container,
body.single-rlms_lesson .td-main-content-wrap .td-container,
body.single-rlms_course .td-main-content-wrap .tdc-row,
body.single-rlms_lesson .td-main-content-wrap .tdc-row{
  width:100% !important;
  max-width:1680px !important;
}
body.single-rlms_course .td-main-content-wrap .td-pb-row,
body.single-rlms_lesson .td-main-content-wrap .td-pb-row{
  max-width:1680px !important;
}

.rlms-h2{font-size:21px; font-weight:800; color:var(--navy); margin:30px 0 12px;}
.rlms-btn{display:inline-block; background:var(--gold); color:var(--text); font-weight:800; font-size:13.5px; text-decoration:none; padding:10px 20px; border-radius:2px; letter-spacing:.02em; border:0; cursor:pointer;}
.rlms-btn:hover{opacity:.88;}
.rlms-btn-secondary{display:inline-block; background:transparent; color:var(--navy); font-weight:700; font-size:13.5px; text-decoration:none; padding:10px 16px; border:1px solid var(--border); border-radius:2px;}
.rlms-btn-secondary:hover{border-color:var(--navy);}

/* ---------- stats banner ---------- */
.rlms-stats{display:flex; flex-wrap:wrap; gap:1px; background:var(--border); border:1px solid var(--border); margin:10px 0 20px;}
.rlms-stat{flex:1; min-width:140px; background:var(--navy); color:#fff; text-align:center; padding:18px 12px;}
.rlms-stat-num{display:block; font-size:28px; font-weight:900; color:var(--gold);}
.rlms-stat-label{display:block; font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; margin-top:4px; color:#fff;}

/* ---------- promo / intro block ---------- */
.rlms-promo{display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:center; background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--navy); padding:22px; margin-bottom:20px;}
.rlms-promo-video, .rlms-promo-media{position:relative; width:100%; padding-top:56.25%; background:#000; border-radius:2px; overflow:hidden;}
.rlms-promo-video iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.rlms-promo-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.rlms-promo-text p{font-size:14px; color:var(--text-2); line-height:1.6; margin:0 0 14px;}
.rlms-intro{font-size:14.5px; color:var(--text-2);}
.rlms-intro p{margin:0 0 14px;}
@media (max-width:820px){ .rlms-promo{grid-template-columns:1fr;} }

/* ---------- progress ---------- */
.rlms-progress{background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:18px 20px; margin-bottom:24px;}
.rlms-progress-loggedout p{margin:0 0 12px;}
.rlms-progress-bar{background:var(--border); border-radius:20px; height:8px; overflow:hidden; margin-bottom:10px;}
.rlms-progress-fill{background:var(--gold); height:100%; border-radius:20px; transition:width .3s ease;}
.rlms-progress-label{font-size:13px; color:var(--text-2); margin:0 0 12px; font-variant-numeric:tabular-nums;}

/* ---------- module / lesson index ---------- */
.rlms-toc{background:var(--surface); border-left:3px solid var(--navy); padding:12px 16px; font-size:13px; margin-bottom:26px; line-height:1.9;}
.rlms-toc a{color:var(--navy); text-decoration:none; font-weight:600;}
.rlms-toc a:hover{text-decoration:underline;}

.rlms-module{padding:6px 0; border-top:1px solid var(--border); scroll-margin-top:20px;}
.rlms-module:first-of-type{border-top:none;}
.rlms-module-title{font-size:16.5px; margin:0; padding:12px 4px; color:var(--text); cursor:pointer; list-style:none; display:flex; align-items:center; gap:10px; -webkit-tap-highlight-color:transparent;}
.rlms-module-title::-webkit-details-marker{display:none;}
.rlms-module-title::before{content:'\25B8'; display:inline-block; flex:0 0 auto; font-size:13px; color:var(--gold); transition:transform .15s ease;}
.rlms-module[open] > .rlms-module-title::before{transform:rotate(90deg);}
.rlms-module-title:hover{color:var(--navy);}
.rlms-module-count{font-size:12px; font-weight:400; color:var(--text-2); text-transform:none;}
.rlms-module > .rlms-lesson-list{padding:4px 0 10px 22px;}

.rlms-lesson-list{margin:0; padding:0; list-style:none;}
.rlms-lesson{display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:13.5px; padding:8px 0; color:var(--text); border-bottom:1px solid var(--border);}
.rlms-lesson:last-child{border-bottom:none;}
.rlms-lesson-icon{font-size:11px; opacity:.6; width:16px; text-align:center;}
.rlms-lesson-complete .rlms-lesson-icon{color:var(--navy); opacity:1;}
.rlms-lesson-unlocked .rlms-lesson-icon{color:var(--gold); opacity:1;}
.rlms-lesson-locked{opacity:.62;}
.rlms-lesson-title{flex:1 1 auto; color:var(--text); text-decoration:none;}
a.rlms-lesson-title:hover{color:var(--navy); text-decoration:underline;}
.rlms-lesson-duration{font-variant-numeric:tabular-nums; font-size:12px; color:var(--text-2); background:var(--surface); padding:2px 8px; border-radius:10px;}
.rlms-lesson-preview{flex-basis:100%; position:relative; width:100%; padding-top:56.25%; background:#000; border-radius:2px; overflow:hidden; margin-top:8px;}
.rlms-lesson-preview iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.rlms-quiz-row{border-top:1px dashed var(--border); margin-top:2px; padding-top:10px; font-weight:600;}
.rlms-quiz-row .rlms-lesson-icon{font-size:13px;}
.rlms-quiz-row.rlms-lesson-complete .rlms-lesson-duration{color:var(--navy); background:transparent; font-weight:700;}

/* ---------- CAMP Simulator hub sidebar (only shown when camp-suite is linked) ---------- */
.rlms-hub{background:var(--surface); border:1px solid var(--border); border-top:4px solid var(--gold); padding:20px; font-size:13px; margin-top:30px;}
.rlms-hub h3{font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--navy); font-weight:800; margin:20px 0 8px;}
.rlms-hub h3:first-child{margin-top:0;}
.rlms-hub ul{list-style:none; margin:0; padding:0;}
.rlms-hub li{margin-bottom:8px; line-height:1.4;}
.rlms-hub a{color:var(--text); text-decoration:none; font-size:12.5px;}
.rlms-hub a:hover{color:var(--navy); text-decoration:underline;}
.rlms-hub-note{font-size:11.5px; color:var(--text-2); font-style:italic; margin:0 0 10px;}
.rlms-hub-btn{display:block; margin-top:2px; background:var(--gold); color:var(--text); text-align:center; font-weight:800; padding:9px; border-radius:2px; text-decoration:none !important; font-size:12px;}
.rlms-hub-btn:hover{opacity:.88;}

/* ---------- lesson page: breadcrumb + progress bar + outline sidebar ----------
   Answers "no timers, no certification name, no breadcrumbs, no progress
   bar, no panels": rlms-crumbs is the Course > Module > Lesson trail (the
   certification name is always visible here, not just a linked back-arrow);
   rlms-mini-progress is the course-wide "X% COMPLETE" bar, same data as the
   course page's own; rlms-outline is the persistent sidebar panel — every
   module, every lesson, current one highlighted — that stays next to every
   lesson, the same role LearnDash's own left-hand panel plays. */
.rlms-crumbs{font-size:12.5px; color:var(--text-2); margin:0 0 10px; line-height:1.6;}
.rlms-crumbs a{color:var(--navy); text-decoration:none; font-weight:600;}
.rlms-crumbs a:hover{text-decoration:underline;}
.rlms-crumb-sep{margin:0 6px; color:var(--border); opacity:.9;}
.rlms-crumb-mid{color:var(--text-2);}
.rlms-crumb-current{color:var(--text); font-weight:700;}

.rlms-mini-progress{display:flex; align-items:center; gap:14px; background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:10px 16px; margin-bottom:22px;}
.rlms-mini-progress-bar{flex:1 1 auto; background:var(--border); border-radius:20px; height:7px; overflow:hidden; max-width:280px;}
.rlms-mini-progress-fill{background:var(--gold); height:100%; border-radius:20px; transition:width .3s ease;}
.rlms-mini-progress-label{flex:0 0 auto; font-size:11.5px; font-weight:800; letter-spacing:.03em; color:var(--navy); white-space:nowrap; font-variant-numeric:tabular-nums;}

.rlms-lesson-layout{display:flex; align-items:flex-start; gap:28px;}
.rlms-lesson-layout-full{display:block;}
.rlms-lesson-main{flex:1 1 auto; min-width:0;}

/* Sticky, but deliberately with no max-height/overflow-y of its own — an
   independently-scrolling sidebar next to the page's own scrollbar reads
   as two scrollbars for one page. A sticky panel taller than the viewport
   just un-sticks once its own bottom is reached, which is the only
   sensible fallback without a second scroll region. */
.rlms-outline{flex:0 0 280px; width:280px; background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:16px; position:sticky; top:20px;}
.rlms-outline-title{font-size:13px; font-weight:800; color:var(--navy); text-transform:uppercase; letter-spacing:.02em; margin:0 0 14px; padding-bottom:10px; border-bottom:2px solid var(--gold);}
.rlms-outline-module{margin-bottom:4px;}
.rlms-outline-module:last-child{margin-bottom:0;}
.rlms-outline-module-title{font-size:12px; font-weight:700; color:var(--text); margin:0; padding:8px 2px; text-transform:none; cursor:pointer; list-style:none; display:flex; align-items:center; gap:7px; -webkit-tap-highlight-color:transparent;}
.rlms-outline-module-title::-webkit-details-marker{display:none;}
.rlms-outline-module-title::before{content:'\25B8'; display:inline-block; flex:0 0 auto; font-size:10px; color:var(--gold); transition:transform .15s ease;}
.rlms-outline-module[open] > .rlms-outline-module-title::before{transform:rotate(90deg);}
.rlms-outline-module-title:hover{color:var(--navy);}
.rlms-outline-module-count{font-size:11px; font-weight:400; color:var(--text-2);}
.rlms-outline-module > .rlms-outline-lesson-list{padding-left:14px;}
.rlms-outline-lesson-list{list-style:none; margin:0; padding:0;}
.rlms-outline-lesson{display:flex; align-items:flex-start; gap:8px; font-size:12.5px; line-height:1.5; padding:6px 8px; border-radius:3px;}
.rlms-outline-lesson-icon{flex:0 0 auto; font-size:10px; opacity:.6; width:14px; text-align:center; margin-top:2px;}
.rlms-outline-lesson-complete .rlms-outline-lesson-icon{color:var(--navy); opacity:1;}
.rlms-outline-lesson-unlocked .rlms-outline-lesson-icon{color:var(--gold); opacity:1;}
.rlms-outline-lesson-locked{opacity:.55;}
.rlms-outline-lesson-title{color:var(--text); text-decoration:none;}
a.rlms-outline-lesson-title:hover{color:var(--navy); text-decoration:underline;}
.rlms-outline-lesson-current{background:#fff; box-shadow:0 0 0 1px var(--navy) inset;}
.rlms-outline-lesson-current .rlms-outline-lesson-title{color:var(--navy); font-weight:700;}

@media (max-width:900px){
  .rlms-lesson-layout{flex-direction:column;}
  .rlms-outline{width:100%; flex:1 1 auto; position:static; max-height:none;}
}

.rlms-back-link{display:inline-block; font-size:13px; color:var(--navy); text-decoration:none; font-weight:600; margin-bottom:14px;}
.rlms-back-link:hover{text-decoration:underline;}
.rlms-lesson-duration-line{font-size:12.5px; color:var(--text-2); margin:0 0 14px; font-variant-numeric:tabular-nums;}
.rlms-timer-icon{opacity:.8;}
.rlms-player{position:relative; width:100%; padding-top:56.25%; background:#000; border-radius:2px; overflow:hidden; margin-bottom:20px;}
.rlms-player iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.rlms-locked-notice{background:var(--surface); border:1px dashed var(--border); border-radius:4px; padding:26px 22px; text-align:center;}
.rlms-locked-notice p{margin:0 0 14px; color:var(--text-2);}
.rlms-lesson-notes{font-size:14.5px; color:var(--text-2); margin:0 0 20px; max-width:760px;}
.rlms-complete-badge{color:var(--navy); font-weight:700; font-size:14px; margin:0 0 20px;}
.rlms-complete-form{margin:0 0 20px;}
.rlms-lesson-nav{display:flex; justify-content:space-between; gap:16px; border-top:1px solid var(--border); padding-top:16px; margin-top:20px; font-size:13.5px;}
.rlms-lesson-nav a{color:var(--navy); text-decoration:none; font-weight:600;}
.rlms-lesson-nav a:hover{text-decoration:underline;}
.rlms-nav-next{margin-left:auto;}

/* ---------- simulation lessons ("Practical Simulation" module) ---------- */
.rlms-lesson-sim-badge{font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.03em; color:var(--navy); background:#fff; border:1px solid var(--navy); padding:2px 8px; border-radius:10px;}
.rlms-sim-panel{background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--gold); border-radius:2px; padding:16px 20px; margin-bottom:20px;}
.rlms-sim-status{font-size:14px; color:var(--text); margin:0; line-height:1.6;}
.rlms-sim-status-complete{color:var(--navy); font-weight:700;}
.rlms-sim-embed{margin-bottom:20px;}

/* ---------- mobile: reduce scrolling + comfortable tap targets ----------
   Beyond the 900px layout-stack above: bigger tap targets on collapsible
   summaries and lesson rows (44px is the usual minimum comfortable target),
   tighter outer padding to reclaim screen width on small phones, and a
   smaller stats banner/promo that don't eat the first screenful before any
   real content shows. */
/* ---------- Phase 3: final exam + certificate ---------- */
.rlms-exam{background:var(--surface); border:1px solid var(--border); border-top:4px solid var(--navy); border-radius:2px; padding:22px 24px; margin:30px 0;}
.rlms-exam-intro, .rlms-exam-last-score{font-size:14px; color:var(--text-2); margin:0 0 18px;}
.rlms-exam-last-score strong{color:var(--cherry);}
.rlms-exam-question{border:0; border-top:1px solid var(--border); padding:16px 0 4px; margin:0;}
.rlms-exam-question:first-of-type{border-top:none; padding-top:0;}
.rlms-exam-question legend{font-size:14.5px; font-weight:700; color:var(--text); padding:0 0 10px; width:100%;}
.rlms-exam-option{display:block; font-size:13.5px; color:var(--text); padding:6px 0; cursor:pointer;}
.rlms-exam-option input{margin-right:8px;}
.rlms-exam-form .rlms-btn{margin-top:16px;}

/* ---------- per-question feedback after a submitted attempt ---------- */
.rlms-exam-feedback{margin:0 0 22px; display:flex; flex-direction:column; gap:10px;}
.rlms-exam-feedback-q{border-left:3px solid var(--border); border-radius:2px; padding:10px 14px; background:#fafafa;}
.rlms-exam-feedback-correct{border-left-color:#2e7d32;}
.rlms-exam-feedback-wrong{border-left-color:var(--cherry);}
.rlms-exam-feedback-title{font-size:13.5px; font-weight:700; color:var(--text); margin:0 0 4px;}
.rlms-exam-feedback-your, .rlms-exam-feedback-answer{font-size:13px; color:var(--text-2); margin:2px 0;}
.rlms-exam-feedback-answer{color:#2e7d32;}

/* ---------- final exam row (always visible in the syllabus flow, LearnDash-style) ---------- */
.rlms-final-exam{border-top:1px solid var(--border); padding:6px 0;}
.rlms-final-exam-title{cursor:default; padding:12px 4px;}
.rlms-final-exam-title::before{content:none;}
.rlms-final-exam > .rlms-lesson-list{padding:4px 0 10px 22px;}

/* ---------- per-module quizzes ("every session ends with an exam") ---------- */
.rlms-module-quiz{margin:14px 0 4px; border-top-color:var(--gold);}
.rlms-module-quiz-locked{font-size:13px; color:var(--text-2); font-style:italic; margin:10px 0 2px; padding:8px 0 0; border-top:1px dashed var(--border);}
.rlms-module-quiz-passed{font-size:13.5px; font-weight:700; color:var(--navy); margin:10px 0 2px; padding:8px 0 0; border-top:1px dashed var(--border);}

.rlms-certificate{background:#fff; border:1px solid var(--border); border-radius:2px; padding:10px; margin:30px 0;}
.rlms-certificate-inner{border:3px double var(--navy); padding:44px 28px; text-align:center; background:var(--surface);}
.rlms-cert-eyebrow{font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin:0 0 18px;}
.rlms-cert-presented{font-size:13.5px; color:var(--text-2); margin:0 0 6px;}
.rlms-cert-name{font-size:26px; font-weight:900; color:var(--navy); margin:0 0 10px; font-family:Georgia,'Times New Roman',serif;}
.rlms-cert-course{font-size:17px; font-weight:700; color:var(--text); margin:0 0 16px;}
.rlms-cert-date{font-size:12.5px; color:var(--text-2); margin:0 0 4px;}
.rlms-cert-brand{font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--cherry); margin:8px 0 0;}
.rlms-cert-print-hint{font-size:11.5px; color:var(--text-2); text-align:center; margin:10px 0 0; font-style:italic;}

/* CAMP-specific certificate: the real Riskpro-branded artwork (2000x1545)
   as a background, with just the student name overlaid in the blank space
   the artwork already reserves for it (~47% down, centered). Every other
   line — title, "has successfully completed...", both signatures, the
   shield — is baked into the image itself. */
.rlms-certificate-camp{padding:0; border:0; background:none;}
.rlms-cert-camp-frame{position:relative; width:100%; max-width:900px; margin:0 auto; aspect-ratio:2000/1545;}
.rlms-cert-camp-bg{display:block; width:100%; height:100%; object-fit:contain;}
.rlms-cert-camp-name{position:absolute; left:50%; top:47%; transform:translate(-50%,-50%); margin:0; width:80%; text-align:center; font-family:Georgia,'Times New Roman',serif; font-weight:700; font-style:italic; font-size:clamp(16px,3.2vw,32px); color:var(--navy,#0f2a4a); white-space:nowrap;}

@media print{
  body.single-rlms_course *{visibility:hidden;}
  .rlms-certificate, .rlms-certificate *{visibility:visible;}
  .rlms-certificate{position:absolute; left:0; top:0; width:100%; border:0; margin:0;}
  .rlms-cert-print-hint{display:none;}
}

@media (max-width:640px){
  .rlms-course, .rlms-pub{font-size:15px; padding:6px 12px;}
  .rlms-stats{flex-direction:column;}
  .rlms-stat{padding:12px 12px;}
  .rlms-module-title{padding:14px 4px; min-height:44px;}
  .rlms-lesson{padding:10px 0; min-height:40px;}
  .rlms-outline-module-title{padding:10px 2px; min-height:40px;}
  .rlms-outline-lesson{padding:8px;}
  .rlms-crumbs{font-size:11.5px;}
  .rlms-mini-progress{flex-wrap:wrap; padding:10px 12px;}
  .rlms-mini-progress-bar{max-width:none; flex-basis:100%;}
  .rlms-btn, .rlms-btn-secondary{width:100%; text-align:center; padding:12px 16px;}
}