/* Flex 7.1: v6-inspired editorial course header + sticky enrolment card.
   Uses Flex typography and the template's Guru colour settings. */
body.flex-guru-enabled div#guru-component {
  background: transparent;
  padding: 0;
  border-radius: 0;
}
div#guru-component .flex-guru-layout {
  --flex-course-ink: #182333;
  --flex-course-muted: #657080;
  --flex-course-line: #e7e9ee;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  grid-template-areas: "intro sidebar" "content sidebar";
  grid-template-rows: auto 1fr;
  gap: 28px 32px;
  align-items: start;
  color: var(--flex-course-ink);
  font-family: inherit;
  margin-block: 24px 48px;
}
div#guru-component .flex-guru-intro {
  grid-area: intro;
  min-width: 0;
  padding: 36px;
  background: linear-gradient(135deg, #fafbfe, #fff5f0);
  border: 1px solid var(--flex-course-line);
  border-radius: 16px;
}
div#guru-component .flex-guru-eyebrow {
  display: inline-block;
  padding: 6px 12px;
  max-width: 100%;
  border-radius: 6px;
  background: #fff;
  color: var(--flex-guru-accent, #f47363);
  font-size: 12px;
  line-height: 1.6;
  font-weight: 700;
  letter-spacing: .03em;
}
div#guru-component .flex-guru-intro .gru-cover-title {
  color: var(--flex-course-ink);
  font-family: inherit;
  font-size: clamp(28px, 3.1vw, 44px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.025em;
  margin: 20px 0 16px;
}
div#guru-component .flex-guru-summary {
  font-size: 15px;
  line-height: 1.8;
  color: var(--flex-course-muted);
  margin: 0 0 20px;
}
div#guru-component .flex-guru-jump {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-weight: 600;
  color: var(--flex-course-ink);
  border-bottom: 2px solid var(--flex-guru-accent, #f47363);
  padding-block: 6px;
  text-decoration: none;
}
div#guru-component .flex-guru-sidebar {
  grid-area: sidebar;
  min-width: 0;
  position: sticky;
  top: var(--flex-guru-sticky-top, 24px);
}
div#guru-component .flex-guru-sidebar .box-inner {
  position: static !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--flex-course-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 14px 40px rgba(24, 35, 51, .08);
}
div#guru-component .flex-guru-sidebar .gru-course-media {
  padding: 0;
  margin: 0;
}
div#guru-component .flex-guru-sidebar .gru-course-media img {
  display: block;
  width: 100%;
  max-height: 260px;
  height: auto;
  object-fit: contain;
  background: #f6f7fa;
}
div#guru-component .flex-guru-layout .flex-guru-sidebar .box-inner > .gru-course-info { padding: 24px; }
div#guru-component .flex-guru-sidebar .gru-cover-details { margin: 0; }
div#guru-component .flex-guru-sidebar .gru-cover-details > div { width: 100%; padding: 0; }
div#guru-component .flex-guru-sidebar .flex-guru-facts ul { margin: 0 0 20px !important; }
div#guru-component .flex-guru-sidebar .flex-guru-facts ul li {
  display: block !important;
  padding: 11px 0 !important;
  margin: 0 !important;
  font-size: 13px;
  line-height: 1.7;
  border-bottom: 1px solid var(--flex-course-line);
  border-top: 0 !important;
}
div#guru-component .flex-guru-sidebar .flex-guru-facts li > i { margin-inline-end: 8px; color: var(--flex-guru-accent, #f47363) !important; }
div#guru-component .flex-guru-sidebar .gru-cover-purchase-btn a {
  display: block;
  width: 100%;
  line-height: 1.5 !important;
  min-height: 48px !important;
  padding: 14px 16px;
  border-radius: 8px;
  background: var(--flex-guru-accent, #f47363) !important;
  border-color: var(--flex-guru-accent, #f47363) !important;
  color: #fff !important;
  text-align: center;
  font-weight: 700;
}
div#guru-component .flex-guru-sidebar .gru-cover-purchase-btn a:hover { background: var(--flex-guru-hover, #e0604f) !important; }
div#guru-component .flex-guru-main { grid-area: content; min-width: 0; margin: 0; }
div#guru-component .flex-guru-main .course-access-bar {
  border: 1px solid var(--flex-course-line);
  border-inline-start: 3px solid var(--flex-guru-accent, #f47363);
  background: #fff;
  border-radius: 8px;
  color: var(--flex-course-muted);
  padding: 14px 18px;
  margin: 0 0 24px;
}
div#guru-component .flex-guru-main .course-access-bar a { color: var(--flex-course-ink); }
div#guru-component .flex-guru-main #guru_tabs { scroll-margin-top: var(--flex-guru-sticky-top, 24px); }
div#guru-component .flex-guru-main #guru_tabs > ul:is(.uk-tab, .wk-tab) {
  margin: 0 0 20px !important;
  padding: 0 !important;
  gap: 6px;
  border: 0;
}
div#guru-component .flex-guru-main #guru_tabs > ul:is(.uk-tab, .wk-tab)::before,
div#guru-component .flex-guru-main #guru_tabs > ul:is(.uk-tab, .wk-tab)::after { display: none; }
div#guru-component .flex-guru-main #guru_tabs > ul:is(.uk-tab, .wk-tab) > li { width: auto; padding: 0; margin: 0; }
div#guru-component .flex-guru-main #guru_tabs > ul:is(.uk-tab, .wk-tab) > li > a {
  padding: 10px 16px !important;
  border: 1px solid var(--flex-course-line);
  border-radius: 8px;
  background: #fff;
  color: var(--flex-course-muted);
  font-size: 13px;
  font-weight: 600;
}
div#guru-component .flex-guru-main #guru_tabs > ul:is(.uk-tab, .wk-tab) > li:is(.uk-active, .wk-active) > a {
  color: #fff;
  background: var(--flex-course-ink);
  border-color: var(--flex-course-ink);
}
div#guru-component .flex-guru-main #guru_tabs > ul:is(.uk-tab, .wk-tab) > li > a::after { display: none; }
div#guru-component .flex-guru-main .tab-content {
  padding: 24px;
  border: 1px solid var(--flex-course-line) !important;
  border-radius: 12px;
  box-shadow: 0 6px 24px rgba(24, 35, 51, .035);
}
div#guru-component .flex-guru-main .table-of-contents { margin-bottom: 16px; }
div#guru-component .flex-guru-main :is(.show_sub, .close_sub) {
  font-size: 12px;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 6px;
}
div#guru-component .flex-guru-layout .flex-guru-main .tab-content input.close_sub {
  background: #f1f3f7 !important;
  color: var(--flex-course-ink) !important;
}
div#guru-component .flex-guru-main .col_title.pull-left { color: var(--flex-course-muted); font-size: 11px; }
div#guru-component .flex-guru-main .guru-tab-title {
  background: #f5f6fa !important;
  border: 0;
  border-inline-start: 3px solid var(--flex-guru-accent, #f47363);
  border-radius: 7px;
  padding: 14px 16px;
  margin: 20px 0 4px;
  font-size: 14px;
  font-weight: 600;
}
div#guru-component .flex-guru-main .tab-content li:is(.uk-grid, .wk-grid) {
  border-bottom: 1px solid var(--flex-course-line) !important;
  padding-block: 15px;
  margin: 0;
  font-size: 12px;
  line-height: 1.7;
}
div#guru-component .flex-guru-main .lesson_name { padding-inline-end: 12px; }
div#guru-component .flex-guru-main .lesson_name a { color: var(--flex-course-ink); font-weight: 500; font-size: 13px; }
div#guru-component .flex-guru-main .lesson_name a:hover { color: var(--flex-guru-accent, #f47363); }
div#guru-component .flex-guru-main .lesson_name a.inactive-lesson { color: var(--flex-course-muted) !important; }
@media (max-width: 991.98px) {
  div#guru-component .flex-guru-layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "intro" "sidebar" "content";
    gap: 24px;
  }
  div#guru-component .flex-guru-sidebar { position: static; }
  div#guru-component .flex-guru-sidebar .gru-course-media img { max-height: 300px; }
}
@media (max-width: 575.98px) {
  div#guru-component .flex-guru-layout { margin-top: 12px; gap: 18px; }
  div#guru-component .flex-guru-intro { padding: 24px 20px; }
  div#guru-component .flex-guru-main .tab-content { padding: 14px; }
  div#guru-component .flex-guru-main .lesson_name a { font-size: 12px; }
}