/* LearnDerm Figma foundation. Inter is self-hosted under the SIL OFL. */
@font-face { font-family: Inter; src: url('../fonts/inter.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
:root {
  --ld-header-gutter: 40px;
  --ld-ink: #1d1f20; --ld-blue: #007da4; --ld-navy: #025c79;
  --ld-background: #f2f2f3; --ld-surface: #fff; --ld-line: #dce3e6;
  --ld-accent-100: #d7f6fa; --ld-accent-200: #86cce0; --ld-accent-300: #85ccc9;
  --ld-accent-500: #258f8c; --ld-accent-600: #1a7472; --ld-accent-700: #115756;
  --ld-accent-800: #0a3b3a; --ld-accent-900: #062524;
  --ld-hero: clamp(2.25rem, 4vw, 3.375rem); --ld-h1: 1.875rem; --ld-h2: 1.75rem; --ld-h3: 1.25rem;
  --ld-radius: 6px; --ld-space: 8px;
  --bs-body-font-family: Inter, system-ui, sans-serif; --bs-body-font-size: 15px;
  --bs-body-color: var(--ld-ink); --bs-body-bg: var(--ld-background);
  --bs-link-color: var(--ld-blue); --bs-link-hover-color: var(--ld-navy);
  --polymer-classic-text: var(--ld-ink); --polymer-classic-background: var(--ld-background);
  --polymer-classic-paragraph-font-size: 15px; --polymer-container-edge-gutter: clamp(1.25rem, 4vw, 5rem);
  --polymer-button-background: var(--ld-blue); --polymer-button-text: #fff;
}
body.learnderm-classic { font-family: Inter, system-ui, sans-serif; font-size: 15px; color: var(--ld-ink); background: var(--ld-background); }
.learnderm-classic :is(h1,h2,h3,h4,h5,h6) { font-family: inherit; color: inherit; line-height: 1.25; letter-spacing: -.025em; }
.learnderm-classic h1 { font-size: var(--ld-h1); font-weight: 800; }
.learnderm-classic h2 { font-size: var(--ld-h2); font-weight: 700; }
.learnderm-classic h3 { font-size: var(--ld-h3); font-weight: 700; }
.ld-display { font-size: var(--ld-hero); font-weight: 800; line-height: 1.1; letter-spacing: -.035em; }
.ld-text-small { font-size: 14px; } .ld-caption { font-size: 12px; } .ld-tag { font-size: 10px; font-weight: 600; }
.learnderm-classic p { font-size: inherit; line-height: 1.6; }
.learnderm-classic a { color: var(--ld-blue); text-underline-offset: .2em; }
.learnderm-classic :is(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid var(--ld-blue); outline-offset: 4px; }
.learnderm-classic .btn { font: inherit; font-weight: 600; border-radius: var(--ld-radius); padding: 12px 24px; line-height: 20px; border-width: 1px; text-decoration: none; }
.learnderm-classic .btn-primary { --bs-btn-bg: var(--ld-blue); --bs-btn-border-color: var(--ld-blue); --bs-btn-color: #fff; --bs-btn-hover-bg: var(--ld-navy); --bs-btn-hover-border-color: var(--ld-navy); }
.learnderm-classic .btn-outline-primary { --bs-btn-color: var(--ld-blue); --bs-btn-border-color: var(--ld-blue); --bs-btn-hover-bg: var(--ld-blue); --bs-btn-hover-border-color: var(--ld-blue); }
.learnderm-classic .btn-primary:hover { background: var(--ld-navy); border-color: var(--ld-navy); }
.learnderm-classic :is(input,textarea,select) { font-family: inherit; accent-color: var(--ld-blue); }
.ld-lesson-card { background: var(--ld-surface); }
.ld-skip-link { position: fixed; top: 8px; left: 8px; padding: 12px 20px; z-index: 2000; background: #fff; transform: translateY(-180%); }
.ld-skip-link:focus { transform: none; }
.ld-site-header { background: var(--ld-navy); color: #fff; }
.ld-site-header .navbar { padding: 16px var(--ld-header-gutter); min-height: 78px; }
.ld-header-inner { display: flex; align-items: center; width: 100%; gap: 24px; }
.ld-site-header .ld-brand { display: inline-flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; flex-shrink: 0; }
.ld-brand-mark { display: grid; place-items: center; width: 64px; height: 46px; background: var(--ld-accent-200); font: italic 36px/1 Georgia, serif; letter-spacing: -4px; padding-right: 4px; }
.ld-brand-name { font-size: 30px; font-weight: 500; letter-spacing: -1.3px; line-height: 1; }
.ld-brand-name sup { font-size: 9px; vertical-align: top; top: 2px; margin-left: 2px; }
.ld-site-header #primary-navigation { margin-left: auto; flex-grow: 0; }
.ld-header-links { display: flex; align-items: center; gap: 32px; }
.ld-site-header :is(a,.nav-link) { color: #fff; text-decoration: none; }
.ld-site-header a:hover { color: var(--ld-accent-100); }
.ld-site-header .ld-button-register { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--ld-accent-200); color: var(--ld-ink); border-color: var(--ld-accent-200); }
.ld-account-icon { flex: 0 0 20px; width: 20px; height: 20px; }
.ld-site-header .ld-button-register:hover { background: var(--ld-accent-100); color: var(--ld-ink); }
.ld-site-header .polymer-menu-toggle, .ld-site-header .polymer-menu-close { color: #fff; }
.ld-site-header :is(a,button):focus-visible, .ld-site-footer a:focus-visible, .ld-footer-cta a:focus-visible { outline-color: var(--ld-accent-200); }
.ld-footer-cta { background: var(--ld-blue); color: #fff; padding: 50px 24px; display: flex; align-items: center; flex-direction: column; gap: 20px; text-align: center; }
.ld-footer-cta h2, .ld-footer-cta p { margin: 0; }
.ld-footer-cta p { max-width: 620px; }
.learnderm-classic .ld-button-white { background: #fff; border-color: #fff; color: var(--ld-blue); }
.learnderm-classic .ld-button-white:hover { background: var(--ld-accent-100); border-color: var(--ld-accent-100); color: var(--ld-navy); }
.ld-site-footer { background: var(--ld-navy); color: #fff; padding: 64px max(24px, calc((100% - 1200px) / 2)) 48px; }
.ld-footer-inner { max-width: 1200px; margin: auto; }
.ld-footer-grid { display: grid; grid-template-columns: 1fr 1fr 2fr; gap: 32px; }
.learnderm-classic .ld-footer-label { font-size: 12px; font-weight: 600; text-transform: uppercase; color: #b4d3de; letter-spacing: .05em; margin: 0 0 16px; }
.ld-footer-menu { list-style: none; margin: 0; padding: 0; }
.ld-footer-menu li + li { margin-top: 12px; }
.ld-footer-group > a { display: block; margin-top: 12px; }
.ld-footer-courses { padding-top: 31px; }
.ld-footer-courses > a:first-child { margin-top: 0; }
.ld-network-links { display: grid; grid-auto-flow: column; grid-template-rows: repeat(3, auto); grid-template-columns: 1fr 1fr; gap: 12px 32px; }
.ld-network-links li + li { margin: 0; }
.ld-site-footer a { color: #fff; text-decoration: none; }
.ld-site-footer a:hover { color: var(--ld-accent-100); text-decoration: underline; }
.ld-footer-languages ul { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 24px; list-style: none; padding: 0; margin: 40px 0 24px; font-size: 12px; }
.ld-footer-languages .current-lang a { font-weight: 700; text-decoration: underline; }
.ld-footer-legal { max-width: 1000px; margin: auto; color: #b4d3de; font-size: 12px; text-align: center; }
.ld-footer-legal p { margin-bottom: 0; }
.ld-footer-legal a { color: inherit; text-decoration: underline; }
@media (max-width: 991.98px) {
  :root { --ld-header-gutter: 20px; }
  .ld-site-header .navbar { padding: 10px var(--ld-header-gutter); min-height: 58px; }
  .ld-header-inner { gap: 16px; }
  .ld-brand-mark { width: 42px; height: 32px; font-size: 27px; letter-spacing: -3px; }
  .ld-brand-name { font-size: 22px; letter-spacing: -.8px; }
  .ld-site-header .ld-brand { gap: 6px; }
  .ld-mobile-auth { margin-left: auto; font-size: 14px; white-space: nowrap; }
  .ld-site-header .polymer-menu-toggle { padding: 0; width: 24px; }
  .ld-site-header .polymer-navigation-overlay { background: var(--ld-navy); color: #fff; }
  .ld-header-links { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 24px; padding: 24px; }
  .ld-header-links .btn { text-align: center; }
  .ld-footer-grid { gap: 24px; grid-template-columns: 1fr 1fr; }
  .ld-footer-network { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
  .ld-footer-cta { padding: 40px 24px; }
  .ld-footer-cta h2 { max-width: 330px; }
  .ld-footer-cta .btn { width: 100%; max-width: 350px; }
  .ld-site-footer { padding: 40px 24px 32px; }
  .ld-footer-grid, .ld-network-links { display: block; }
  .ld-footer-courses { padding-top: 24px; }
  .ld-footer-network { margin-top: 32px; }
  .ld-network-links li + li { margin-top: 12px; }
  .ld-footer-languages ul { border-top: 1px solid #ffffff30; padding-top: 24px; margin-top: 32px; justify-content: flex-start; }
  .ld-footer-legal { border-top: 1px solid #ffffff30; padding-top: 24px; text-align: left; }
}
@media (prefers-reduced-motion: reduce) { .ld-site-header, .ld-site-header * { transition: none !important; } }
/* Link rules also apply to legacy anchors rebuilt as Bootstrap buttons. */
.learnderm-classic a.btn-primary, .learnderm-classic .ld-learning a.btn-primary { color: #fff; }
@media (max-width: 991.98px) {
  .ld-site-header .navbar { min-height: 48px; padding-block: 8px; }
  .ld-site-header .polymer-menu-toggle { min-height: 32px; height: 32px; }
  .ld-site-header .polymer-navigation-overlay .ld-header-links { display: flex; padding: 24px; }
}

/* Editable Single Column callout on the homepage. */
.polymer-classic-layout.ld-footer-cta { display: block; padding: 50px 24px !important; }
.ld-footer-cta > .polymer-layout__container { padding: 0; max-width: none; }
.ld-footer-cta > .polymer-layout__container > .row { margin: 0; }
.ld-footer-cta > .polymer-layout__container > .row > [class*="col-"] {
  display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 0; margin-top: 0;
}
@media (max-width: 575.98px) {
  .polymer-classic-layout.ld-footer-cta { padding: 40px 24px !important; }
}
/* Home: editable WYSIWYG hero and two native Polymer Cards. */
.polymer-classic-layout.ld-home-hero {
  background: linear-gradient(25deg, #025c79 0%, #009eb7 52%, #71ac21 100%);
  color: #fff; padding: 40px 24px !important; text-align: center;
}
.ld-home-hero .polymer-layout__container { max-width: 900px; padding: 0; }
.ld-home-hero .row { margin: 0; }
.ld-home-hero .row > [class*="col-"] { padding: 0; margin-top: 0; }
.ld-home-logo { width: 247px; height: auto; display: block; margin: auto; }
.ld-home-hero p:first-child { margin: 0 0 24px; }
.learnderm-classic .ld-home-hero h1 { font-size: 48px; line-height: 1.2; letter-spacing: 0; font-weight: 800; margin: 0 auto 12px; max-width: 720px; }
.ld-home-hero p:last-child { font-size: 18px; line-height: 1.4; margin: 0; }
.polymer-classic-layout.ld-home-pathways { padding: 56px 24px !important; }
.ld-home-pathways .polymer-layout__container { max-width: 1200px; padding: 0; }
.ld-home-pathways .row { margin: 0; gap: 20px; flex-wrap: nowrap; }
.ld-home-pathways .row > [class*="col-"] { padding: 0; margin: 0; flex: 1 1 0; width: auto; min-width: 0; }
.ld-home-pathways .polymer-card { background: #fff; color: #303942; border: 1px solid #bfc2c5; border-radius: 10px; box-shadow: none; transition: transform 240ms ease, border-color 240ms ease, box-shadow 240ms ease; }
.ld-home-pathways .card-body { padding: 32px; }
.learnderm-classic .ld-home-pathways .card-title { font-size: 20px; line-height: 1.3; font-weight: 700; letter-spacing: -.025em; margin: 0 0 16px; }
.ld-home-pathways .card-text { margin: 0 0 16px; }
.ld-home-pathways .card-text p { font-size: 15px; line-height: 1.65; margin: 0; }
.learnderm-classic .ld-home-pathways .polymer-button { background: transparent; color: var(--ld-blue); border: 0; padding: 0; border-radius: 0; font-size: 14px; font-weight: 600; line-height: 1.5; text-align: left; }
.ld-home-pathways .polymer-button::after { content: ''; }
.ld-home-pathways .polymer-button::before { content: '→'; float: right; margin-left: 8px; }
.learnderm-classic .ld-home-pathways .polymer-button,
.learnderm-classic .ld-home-pathways .polymer-button:hover,
.learnderm-classic .ld-home-pathways .polymer-button:focus { text-decoration: none; }
@media (hover: hover) and (pointer: fine) {
  .ld-home-pathways .polymer-card:hover { border-color: var(--ld-blue); transform: translateY(-4px); box-shadow: 0 8px 20px rgb(2 92 121 / 10%); }
}
@media (prefers-reduced-motion: reduce) {
  .ld-home-pathways .polymer-card { transition: none; }
  .ld-home-pathways .polymer-card:hover { transform: none; }
}
@media (max-width: 767.98px) {
  .polymer-classic-layout.ld-home-hero { padding: 32px 24px !important; }
  .ld-home-logo { width: 200px; }
  .learnderm-classic .ld-home-hero h1 { font-size: 30px; }
  .ld-home-hero p:last-child { font-size: 15px; }
  .polymer-classic-layout.ld-home-pathways { padding: 24px !important; }
  .ld-home-pathways .row { flex-direction: column; gap: 20px; }
  .ld-home-pathways .card-body { padding: 24px; }
}
.learnderm-classic .ld-home-pathways .polymer-button { display: inline-flex; align-items: center; gap: 8px; }
.ld-home-pathways .polymer-button::before { order: 1; float: none; margin-left: 0; }

/* Card icons now come from Polymer’s optional Media Library field. */
.ld-home-pathways .polymer-card { --polymer-card-icon-size: 44px; }

/* Catalog course cards share the homepage's white surface and hover treatment. */
.learnderm-classic .ld-course-card { background: #fff; border-color: #bfc2c5; border-radius: 10px; }
.learnderm-classic .ld-course-collection { padding-top: 40px; row-gap: 64px; }
.learnderm-classic .ld-course-card { position: relative; overflow: visible; }
.learnderm-classic .ld-course-card.has-sponsor { border-top-left-radius: 0; }
.ld-sponsor-tab { position: absolute; left: -1px; top: -39px; height: 40px; max-width: calc(100% + 2px); display: flex; align-items: center; gap: 8px; padding: 7px 12px; border: 1px solid; border-color: inherit; border-bottom: 0; border-radius: 8px 8px 0 0; background: #fff; }
.ld-sponsor-tab > span { color: var(--ld-blue); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; white-space: nowrap; }
.ld-sponsor-tab .ld-sponsor-logo { display: block; max-width: 125px; width: auto; height: 24px; object-fit: contain; }
.ld-sponsor-link { display: inline-flex; align-items: center; flex-shrink: 0; }
.ld-sponsor-link:focus-visible { outline: 2px solid var(--ld-blue); outline-offset: 4px; border-radius: 2px; }
.ld-sponsor-notice { background: #d4f6fa; color: #006d88; }
.ld-sponsored-lesson #main.site-main { padding-top: 0; }
.ld-sponsor-notice > .container { display: flex; align-items: center; gap: 12px; padding-block: 16px; }
.ld-sponsor-notice p { flex: 1; margin: 0; font-size: 14px; line-height: 1.6; }
.ld-sponsor-info { align-self: flex-start; line-height: 1.6; }
.ld-sponsor-notice .ld-sponsor-logo { display: block; max-width: 150px; max-height: 38px; width: auto; height: auto; object-fit: contain; }
@media (max-width: 575.98px) {
    .ld-sponsor-notice > .container { flex-wrap: wrap; }
    .ld-sponsor-notice p { flex-basis: calc(100% - 32px); }
    .ld-sponsor-notice .ld-sponsor-link, .ld-sponsor-notice > .container > .ld-sponsor-logo { margin-left: 28px; }
}
@media (hover: hover) and (pointer: fine) {
  .learnderm-classic .ld-course-card:hover { border-color: var(--ld-blue); }
}
.learnderm-classic .ld-course-card .ld-card-main { color: #303942; }
.learnderm-classic .ld-course-card .ld-card-main h2 { font-size: 20px; line-height: 1.3; }
.ld-course-labels { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.ld-course-label { display: inline-block; background: #d4f6fa; color: #303942; padding: 5px 8px; font-size: 11px; font-weight: 700; line-height: 1.4; letter-spacing: .1em; text-transform: uppercase; }

/* Structured course and section reading layouts. */
.ld-new-course { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 40px; align-items: start; }
.learnderm-classic .ld-new-course h1, .learnderm-classic .ld-new-section h1 { font-size: clamp(28px, 3.5vw, 40px); line-height: 1.2; margin: 20px 0; }
.ld-course-summary { color: #646c72; margin-bottom: 32px; }
.ld-course-details { background: #fff; padding: 24px; border: 1px solid #d2d6d8; border-radius: 10px; }
.learnderm-classic .ld-course-details h2 { font-size: 20px; margin-top: 0; }
.ld-course-details dl { display: grid; grid-template-columns: 1fr auto; gap: 12px; margin: 0; }
.ld-course-details dt { font-weight: 400; color: #646c72; }
.ld-course-details dd { margin: 0; font-weight: 700; }
#ld-section-progress { display: block; width: 100%; height: 8px; margin: 12px 0 32px; accent-color: var(--ld-blue); }
.ld-section-list { list-style: none; padding: 0; border: 1px solid #d2d6d8; border-radius: 10px; overflow: hidden; background: #fff; margin-bottom: 24px; }
.ld-section-list > li:nth-child(odd) { background: #eef0f2; }
.ld-section-list > li > a { display: flex; align-items: center; gap: 12px; padding: 20px; color: #303942; text-decoration: none; }
.ld-section-list > li > a:hover { color: var(--ld-blue); }
.ld-section-meta { margin-left: auto; font-size: 13px; color: #646c72; }
.ld-section-state { display: inline-flex; flex: 0 0 26px; width: 26px; height: 26px; align-items: center; justify-content: center; border: 2px solid var(--ld-blue); border-radius: 50%; color: var(--ld-blue); }
.ld-section-state .ld-play-icon { display: block; width: 42%; height: 54%; flex-shrink: 0; transform: translateX(1px); }
.ld-section-state.is-complete { background: var(--ld-blue); color: #fff; }
.ld-section-list details { padding: 0 20px 16px 58px; font-size: 14px; }
.ld-section-list details ul { padding-left: 20px; margin-top: 12px; line-height: 1.9; }
.ld-new-section { max-width: 850px; margin-inline: auto; }
.ld-learning--with-ads { max-width: 1440px; padding-inline: var(--ld-header-gutter); }
.ld-lesson-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: start; }
.ld-lesson-content { min-width: 0; }
.ld-new-course.ld-new-course--with-ads { grid-template-columns: minmax(0, 1fr); }
.ld-lesson-sidebar { display: grid; gap: 24px; width: 300px; }
.ld-course-ad { width: 300px; margin: 0; }
.ld-course-ad figcaption { color: #6e7b82; font-size: 10px; line-height: 1.5; text-align: center; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 8px; }
.ld-course-ad--preview .ld-course-ad__slot { display: grid; place-items: center; border: 1px dashed #c4cdd2; background: repeating-linear-gradient(45deg,#f7f8f9,#f7f8f9 15px,#e7ebed 16px,#f7f8f9 17px); text-align: center; color: #637079; font-size: 14px; }
.ld-course-ad--preview .ld-course-ad__slot span { background: #ffffffdb; padding: 12px 20px; }
.ld-course-ad--preview small { display: block; font-size: 11px; margin-top: 4px; }
@media(max-width:991.98px) { .ld-lesson-layout { grid-template-columns: minmax(0,1fr); gap: 32px; } .ld-lesson-sidebar { margin-inline: auto; max-width: 100%; } }
@media(max-width:339.98px) { .ld-lesson-sidebar .ld-course-ad { display: none; } }
.ld-reading-time { color: #646c72; font-size: 14px; }
.ld-content-block { margin-block: 24px; }
.learnderm-classic .ld-new-section h2 { color: var(--ld-blue); font-size: 20px; line-height: 1.35; }
.ld-lesson-callout { padding: 20px; border-left: 3px solid var(--ld-blue); border-radius: 8px; background: #d4f6fa; margin-block: 24px; }
.learnderm-classic .ld-lesson-callout h2 { font-size: 18px; margin: 0 0 12px; color: #303942; }
.ld-lesson-callout .ld-richtext > :last-child { margin-bottom: 0; }
.ld-lesson-callout--pearls { background: #fff; border: 1px solid var(--ld-blue); }
.learnderm-classic .ld-lesson-callout--pearls h2 { color: var(--ld-blue); }
.ld-clinical-images { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ld-clinical-images figure { margin: 0; min-width: 0; }
.ld-clinical-images .ld-image-open { border-radius: 8px; overflow: hidden; background: #fff; }
.ld-clinical-images img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: contain; }
.ld-clinical-images figcaption { font-size: 13px; line-height: 1.5; margin-top: 8px; }
.ld-image-credit { display: block; color: #646c72; font-size: 12px; }
.ld-practice { background: #fff; padding: 24px; border: 1px solid #bfc2c5; border-radius: 10px; }
.ld-practice legend { float: none; font-size: 20px; font-weight: 700; margin-bottom: 16px; }
.ld-practice-option { display: flex; align-items: baseline; gap: 10px; padding: 12px; border: 1px solid #d2d6d8; border-radius: 6px; margin-bottom: 10px; cursor: pointer; }
.ld-practice-option input { accent-color: var(--ld-blue); }
.ld-practice-result:not(:empty) { margin-top: 16px; padding: 16px; background: #eef0f2; border-radius: 6px; }
.ld-practice-result.is-correct { background: #edf8f1; }
.ld-new-navigation { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; margin-top: 32px; }
.ld-topics-divider { margin: 40px 0 32px; border: 0; border-top: 1px solid #d2d6d8; opacity: 1; }
.ld-new-navigation [data-ld-completion] { margin: 0; }
.ld-new-navigation [data-ld-next][aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.ld-new-navigation .ld-next-help { flex-basis: 100%; margin: 0; font-size: 14px; color: #626c75; }
.ld-completion-button { min-width: 150px; }
.ld-completion-button.is-complete:disabled { background: #e9f3e8; border-color: #a9cba5; color: #206541; opacity: 1; }
.ld-completion-feedback { margin: 0; font-size: 13px; max-width: 280px; }
.ld-completion-feedback:not(.is-error) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.ld-completion-feedback.is-error { color: #a52d35; margin-top: 8px; }
.ld-topic-links { line-height: 1.9; }
@media (max-width: 991.98px) { .ld-new-course { grid-template-columns: 1fr; } .ld-course-details { grid-row: 1; } }
@media (max-width: 575.98px) { .ld-clinical-images { grid-template-columns: 1fr; } .ld-section-list > li > a { padding: 16px; gap: 8px; } .ld-section-meta { font-size: 12px; } }
body.learnderm-classic.ld-reading-page { background: #fff; }
.ld-practice fieldset { border: 0; padding: 0; margin: 0 0 16px; min-width: 0; }
#ld-section-progress { appearance: none; border: 0; background: var(--ld-accent-200); }
#ld-section-progress::-webkit-progress-bar { background: var(--ld-accent-200); }
#ld-section-progress::-webkit-progress-value { background: var(--ld-blue); }
#ld-section-progress::-moz-progress-bar { background: var(--ld-blue); }

/* Topic completion is independent of its parent section. */
.ld-topic-status-list, .ld-section-list details .ld-topic-status-list { list-style: none; padding: 0; margin: 12px 0; }
.ld-topic-status-list li { margin: 0; }
.ld-topic-status-list a { display: flex; align-items: center; gap: 10px; padding: 8px 0; line-height: 1.5; text-decoration: none; }
.ld-topic-title { min-width: 0; }
.ld-topic-status-list a:hover .ld-topic-title { text-decoration: underline; }
.ld-topic-status-list .ld-section-state { flex-basis: 20px; width: 20px; height: 20px; font-size: 13px; }
.ld-topic-status { margin-left: auto; flex-shrink: 0; color: #646c72; font-size: 12px; }
.ld-topic-status-list .is-complete ~ .ld-topic-status { color: var(--ld-blue); font-weight: 600; }
@media (max-width: 575.98px) {
    .ld-topic-status-list a { flex-wrap: wrap; }
    .ld-topic-title { flex: 1; }
    .ld-topic-status { flex-basis: calc(100% - 34px); margin-left: 34px; }
}

/* Learner account dashboard and native account editor. */
.ld-dashboard { max-width: 960px; margin-inline: auto; }
.ld-profile-summary { background: var(--ld-dark-blue, #005a72); color: #fff; padding: 40px; border-radius: 12px; }
.ld-profile-identity { display: flex; align-items: center; gap: 20px; }
.ld-profile-avatar { display: flex; align-items: center; justify-content: center; flex: 0 0 72px; height: 72px; border-radius: 50%; background: #82ccd0; color: #005a72; font-size: 24px; font-weight: 700; }
.learnderm-classic .ld-profile-summary h2 { color: #fff; font-size: 26px; margin: 0 0 8px; }
.ld-profile-identity p { margin: 3px 0; font-size: 14px; }
.ld-profile-summary .ld-edit-account { margin-left: auto; white-space: nowrap; background: #82e0e9; color: #15313d; font-size: 14px; }
.ld-profile-summary .ld-edit-account:hover { background: #b0edf2; }
.ld-profile-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; text-align: center; margin: 36px 0 0; }
.ld-profile-stats dt { font-size: 12px; text-transform: uppercase; letter-spacing: .07em; font-weight: 400; }
.ld-profile-stats dd { margin: 4px 0 0; font-size: 42px; font-weight: 700; line-height: 1.2; }
.ld-profile-history, .ld-profile-quizzes, .ld-profile-badges { margin-top: 36px; }
.ld-badge-collection { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; list-style: none; margin: 20px 0 0; padding: 0; }
.ld-earned-badge { display: flex; align-items: flex-start; gap: 20px; padding: 24px; border: 1px solid #d2d6d8; border-radius: 12px; background: #fff; }
.ld-earned-badge-art { flex: 0 0 96px; }
.ld-earned-badge-image { width: 96px; height: 120px; object-fit: contain; }
.ld-earned-badge-placeholder { display: flex; align-items: center; justify-content: center; height: 120px; color: var(--ld-blue); font-size: 48px; }
.ld-earned-badge-details { min-width: 0; overflow-wrap: anywhere; }
.learnderm-classic .ld-earned-badge h3 { margin: 0 0 10px; font-size: 20px; line-height: 1.3; }
.ld-earned-badge-description { font-size: 14px; line-height: 1.6; }
.ld-earned-badge-description p { margin: 0 0 12px; }
.ld-earned-badge-date { margin: 12px 0 0; font-size: 12px; color: #646c72; }
.ld-badges-empty { padding: 24px; border-radius: 12px; background: #f2f2f3; }
@media (max-width: 767.98px) {
    .ld-badge-collection { grid-template-columns: 1fr; }
    .ld-earned-badge { padding: 20px; gap: 16px; }
    .ld-earned-badge-art { flex-basis: 72px; }
    .ld-earned-badge-image { width: 72px; height: 90px; }
}
.learnderm-classic .ld-dashboard h2 { font-size: 24px; }
.ld-history-list { list-style: none; padding: 0; margin: 20px 0; border-block: 1px solid #d2d6d8; }
.ld-history-list li { display: flex; align-items: center; gap: 14px; padding: 20px 8px; border-bottom: 1px solid #e6e8e9; }
.ld-history-list li:last-child { border-bottom: 0; }
.ld-history-dot { flex: 0 0 12px; height: 12px; border-radius: 50%; background: #82e0e9; }
.ld-history-dot.is-complete { background: #91c83e; }
.ld-history-title { flex: 1; color: #303942; text-decoration: none; }
.ld-history-title:hover { color: var(--ld-blue); text-decoration: underline; }
.ld-history-time { font-size: 13px; color: #646c72; white-space: nowrap; }
.ld-history-continue { padding: 8px 14px; font-size: 13px; }
.ld-history-status { background: #d3f4f8; color: #005a72; padding: 5px 8px; text-transform: uppercase; font-size: 10px; font-weight: 700; letter-spacing: .05em; white-space: nowrap; }
.ld-history-status.is-complete { background: #edf5df; color: #446615; }
.ld-account-editor { max-width: 800px; margin-inline: auto; }
.ld-account-form { margin-top: 28px; }
.ld-account-form fieldset { border: 1px solid #d2d6d8; padding: 24px; border-radius: 10px; margin-bottom: 28px; background: #fff; }
.ld-account-form legend { float: none; width: auto; padding: 0 8px; font-size: 20px; font-weight: 700; }
.ld-account-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.ld-account-form label { display: block; font-size: 14px; font-weight: 600; }
.ld-account-form input, .ld-account-form select { display: block; width: 100%; padding: 12px; margin-top: 8px; border: 1px solid #aeb7bc; border-radius: 5px; background: #fff; color: #303942; font: inherit; font-weight: 400; min-height: 46px; }
.ld-account-form input[readonly] { background: #f2f2f3; }
.ld-account-form input:focus, .ld-account-form select:focus { outline: 2px solid var(--ld-blue); outline-offset: 2px; }
.ld-account-form small, .ld-account-form fieldset p { font-size: 13px; color: #646c72; font-weight: 400; }
.ld-account-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.ld-account-error, .ld-account-notice { padding: 16px; margin-block: 20px; border-radius: 6px; }
.ld-account-error { border: 1px solid #bd3838; background: #fff0f0; color: #862525; }
.ld-account-notice { background: #edf5df; color: #446615; }
@media (max-width: 767.98px) {
    .ld-profile-summary { padding: 24px; }
    .ld-profile-identity { flex-wrap: wrap; }
    .ld-profile-identity > div { flex: 1; min-width: 150px; }
    .ld-profile-summary .ld-edit-account { margin-left: 0; }
    .ld-history-list li { flex-wrap: wrap; }
    .ld-history-title { flex-basis: calc(100% - 30px); }
    .ld-history-continue { margin-left: 26px; }
    .ld-account-grid { grid-template-columns: 1fr; }
    .ld-account-form fieldset { padding: 18px; }
}

body.learnderm-classic.ld-account-page { background: #fff; }

.ld-badge-location-marker { display: block; height: 1px; }
#ld-badge-notice { position: fixed; bottom: 24px; right: 24px; z-index: 1050; width: min(420px, calc(100vw - 48px)); display: grid; gap: 14px; max-height: calc(100dvh - 48px); overflow-y: auto; padding: 12px; margin: -12px; }
.ld-badge-toast { position: relative; display: flex; align-items: center; gap: 18px; padding: 24px 46px 24px 20px; border: 1px solid #82e0e966; border-radius: 16px; background: linear-gradient(135deg, #005a72, #003c50); color: #fff; box-shadow: 0 12px 32px #003c5040; animation: ld-badge-arrive .55s cubic-bezier(.22, 1, .36, 1) both; }
.ld-badge-toast-art { flex: 0 0 80px; display: grid; place-items: center; width: 80px; height: 96px; border-radius: 12px; background: #ffffff14; }
.ld-badge-toast-art img { width: 72px; height: 88px; object-fit: contain; filter: drop-shadow(0 3px 5px #0004); }
.ld-badge-toast-art span { font-size: 42px; color: #82e0e9; }
.ld-badge-toast-content { min-width: 0; overflow-wrap: anywhere; }
.ld-badge-toast-label { margin: 0 0 6px; color: #82e0e9; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.ld-badge-toast-name { margin: 0 0 10px; font-size: 20px; font-weight: 700; line-height: 1.25; }
.ld-badge-toast-description { margin: 0 0 12px; font-size: 13px; line-height: 1.55; color: #e0eff2; white-space: pre-line; }
.ld-badge-toast-content a { color: #fff; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
.ld-badge-toast-content a:hover { color: #82e0e9; }
.ld-badge-toast-dismiss { position: absolute; top: 6px; right: 6px; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; padding: 0; background: transparent; color: #fff; font-size: 26px; cursor: pointer; }
.ld-badge-toast-dismiss:hover { background: #ffffff20; }
.ld-badge-toast-dismiss:focus-visible, .ld-badge-toast-content a:focus-visible { outline: 2px solid #82e0e9; outline-offset: 3px; }
.ld-badge-toast.is-leaving { animation: ld-badge-leave .3s ease-in both; pointer-events: none; }
@keyframes ld-badge-arrive { from { opacity: 0; transform: translateX(110%); } to { opacity: 1; transform: translateX(0); } }
@keyframes ld-badge-leave { to { opacity: 0; transform: translateX(110%); } }
@media (max-width: 575.98px) {
    #ld-badge-notice { right: 16px; bottom: 16px; width: calc(100vw - 32px); }
    .ld-badge-toast { gap: 14px; padding: 20px 42px 20px 16px; }
    .ld-badge-toast-art { flex-basis: 64px; width: 64px; height: 80px; }
    .ld-badge-toast-art img { width: 56px; height: 72px; }
    .ld-badge-toast-name { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .ld-badge-toast, .ld-badge-toast.is-leaving { animation-duration: .01ms; }
}

/* Editable activity introductions and image-based questions. */
.ld-interactive-label { display: inline-block; padding: 4px 10px; background: #d4f6fa; color: var(--ld-blue); text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: .1em; margin: 0 0 12px; }
.learnderm-classic .ld-practice h2 { margin: 0 0 16px; font-size: 26px; }
.ld-practice-intro { margin-bottom: 24px; }
.ld-practice-image { max-width: 640px; margin: 0 auto 24px; }
.ld-practice-image img { display: block; width: 100%; max-height: 460px; object-fit: contain; border-radius: 8px; }
.ld-practice-option:has(input:checked) { border-color: var(--ld-blue); background: #eaf8fa; }
.ld-practice-option:focus-within { outline: 2px solid var(--ld-blue); outline-offset: 2px; }

.ld-profile-leaderboard { margin-top: 48px; }
.ld-leaderboard-heading { display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; align-items: center; }
.ld-leaderboard-heading h2 { margin: 0; }
.ld-leaderboard-heading p { margin: 0; color: var(--ld-blue); font-weight: 700; }
.ld-leaderboard-intro { margin: 16px 0 24px; color: #646c72; }
.ld-leaderboard-table-wrap { border: 1px solid #d2d6d8; border-radius: 12px; overflow: hidden; background: #fff; }
.ld-leaderboard-table { width: 100%; border-collapse: collapse; color: #303942; text-align: left; }
.ld-leaderboard-table thead { background: #f2f2f3; color: #777e82; text-transform: uppercase; font-size: 12px; letter-spacing: .04em; }
.ld-leaderboard-table th, .ld-leaderboard-table td { padding: 20px 24px; border-bottom: 1px solid #dce0e2; }
.ld-leaderboard-table tbody th { font-weight: 400; overflow-wrap: anywhere; }
.ld-leaderboard-table tr > :first-child { width: 92px; font-weight: 700; }
.ld-leaderboard-table tr > :last-child { width: 108px; text-align: right; font-weight: 700; }
.ld-leaderboard-table tbody tr:last-child > * { border-bottom: 0; }
.ld-leaderboard-table tfoot > tr > * { border-top: 2px solid #d2d6d8; border-bottom: 0; }
.ld-leaderboard-table .is-current-user { background: #eff7df; }
.ld-leaderboard-table .is-current-user th { font-weight: 700; }
.ld-leaderboard-star { color: #91c83e; margin-right: 12px; }
.ld-leaderboard-you { display: inline-block; margin-left: 12px; font-size: 11px; color: #557822; }
.ld-leaderboard-table .ld-leaderboard-empty { text-align: left; font-weight: 400; }
@media (max-width: 575.98px) {
  .ld-leaderboard-table th, .ld-leaderboard-table td { padding: 16px 12px; font-size: 13px; }
  .ld-leaderboard-table tr > :first-child { width: 52px; }
  .ld-leaderboard-table tr > :last-child { width: 68px; }
  .ld-leaderboard-star { margin-right: 6px; }
  .ld-leaderboard-you { margin-left: 6px; }
}

/* Once pathway columns enter, let card hover lifts and shadows extend beyond them. */
html.polymer-motion-ready .ld-home-pathways.polymer-animate-columns.is-polymer-visible > .container > .row > * { clip-path: none; }

/* Native footer-builder rows retain the Learnderm footer's spacing and responsive grid. */
.ld-site-footer.site-footer--builder .polymer-classic-layout { padding: 0 !important; }
.ld-site-footer.site-footer--builder .polymer-layout__container { width: 100%; max-width: 1200px; padding: 0; }
.ld-footer-builder-nav .row { display: grid; grid-template-columns: 1fr 1fr 2fr; gap: 32px; margin: 0; }
.ld-footer-builder-nav .row > [class*="col-"] { width: auto; padding: 0; margin: 0; }
.ld-footer-builder-nav .ld-footer-menu li > p { margin: 0; }
.ld-footer-builder-legal { max-width: 1000px; margin: auto; color: #b4d3de; font-size: 12px; text-align: center; }
.ld-footer-builder-legal p { margin-bottom: 0; }
.ld-footer-builder-legal a { color: inherit; text-decoration: underline; }
@media (max-width: 991.98px) {
  .ld-footer-builder-nav .row { grid-template-columns: 1fr 1fr; gap: 24px; }
  .ld-footer-builder-nav .ld-footer-network { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
  .ld-footer-builder-nav .row { display: block; }
  .ld-footer-builder-legal { border-top: 1px solid #ffffff30; padding-top: 24px !important; text-align: left; }
  .ld-site-footer.site-footer--builder .ld-footer-builder-legal { padding-top: 24px !important; }
}