/**
 * Quescol — Tutor LMS 4 dashboard + legacy frontend polish.
 * Tutor 4 uses data-tutor-theme + --tutor-surface-* tokens (not the v3 left-menu).
 */

/* ---------- Site menu (Tutor 4 skips get_header — we inject .qc-site-header) ---------- */
body:has(.tutor-dashboard-layout) header.nav,
body:has(.tutor-dashboard-layout) header.qc-site-header,
body:has(.tutor-dashboard-isolated-page-wrapper) header.nav,
body.tutor-screen-frontend-dashboard header.nav,
body.tutor-frontend header.nav,
body.tutor-lms header.nav,
body.qc-tutor-skinned header.nav,
body.qc-tutor-skinned header.qc-site-header{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:sticky;
  top:0;
  z-index:10050;
  width:100%;
  overflow:visible!important;
}

/* Site footer on Tutor 4 bare shells (dashboard / learning only).
   Do NOT zero margin on body.qc-tutor-skinned — course singles also get
   that class and need the normal theme footer gap (margin-top:88px). */
body:has(.tutor-dashboard-layout) footer.site-footer,
body:has(.tutor-dashboard-layout) footer.qc-site-footer,
body:has(.tutor-lesson-content) footer.site-footer,
body:has(.tutor-learning-area) footer.site-footer,
body:has(.tutor-course-single-content-wrapper) footer.site-footer{
  display:block!important;
  visibility:visible!important;
  position:relative;
  z-index:1; /* below fixed Tutor mobile tab bar */
  width:100%;
  margin-top:0;
}

/* Mobile: keep site footer visible, but clear space under it so content
   is not covered by Tutor's fixed tab bar. Tab bar stays on top via z-index. */
@media (max-width:575.98px){
  body:has(.tutor-dashboard-layout) footer.site-footer,
  body:has(.tutor-dashboard-layout) footer.qc-site-footer,
  body:has(.tutor-dashboard-nav-mobile) footer.site-footer,
  body:has(.tutor-dashboard-nav-mobile) footer.qc-site-footer{
    display:block!important;
    padding-bottom:calc(96px + env(safe-area-inset-bottom, 0px))!important;
  }
}

/* Keep Tutor 4 mobile tab bar above site footer while scrolling */
.tutor-dashboard-nav-mobile{
  z-index:10040!important;
  position:fixed!important;
  bottom:0!important;
  left:0!important;
  right:0!important;
}
.tutor-dashboard-nav-mobile-more-popover{
  z-index:10041!important;
}

/* ---------- Tutor 4 layout under site menu ---------- */
body:has(header.qc-site-header) .tutor-dashboard-layout,
body:has(header.nav.qc-site-header) .tutor-dashboard-layout{
  min-height:calc(100dvh - 64px);
}
body:has(header.qc-site-header) .tutor-dashboard-sidebar{
  min-height:calc(100dvh - 64px);
  top:0;
  background-color:var(--tutor-surface-sidebar-l1, var(--card))!important;
}

body.tutor-frontend .qc-site-header .nav-cta,
body.tutor-screen-frontend-dashboard .qc-site-header .nav-cta,
body.qc-tutor-skinned .qc-site-header .nav-cta{
  overflow:visible!important;
}

body.tutor-frontend .qc-site-header .qc-user-menu__btn,
body.tutor-screen-frontend-dashboard .qc-site-header .qc-user-menu__btn,
body.qc-tutor-skinned .qc-site-header .qc-user-menu__btn{
  min-width:48px!important;
  width:auto!important;
}

body.tutor-frontend .qc-site-header .qc-user-menu__panel[hidden],
body.tutor-screen-frontend-dashboard .qc-site-header .qc-user-menu__panel[hidden],
body.qc-tutor-skinned .qc-site-header .qc-user-menu__panel[hidden]{
  display:none!important;
}
.tutor-dashboard-home-card,
.tutor-dashboard-page-card,
.tutor-dashboard-welcome-card,
.tutor-dashboard-courses-card,
.tutor-my-courses-card,
.tutor-profile-card,
.tutor-discussion-card,
.tutor-card{
  background-color:var(--tutor-surface-l1, var(--card))!important;
  color:var(--tutor-text-primary, var(--ink))!important;
  border-color:var(--tutor-border-idle, var(--hairline))!important;
}
.tutor-dashboard-main,
.tutor-dashboard-body,
.tutor-dashboard-page{
  background-color:var(--tutor-surface-base, var(--paper))!important;
  color:var(--tutor-text-primary, var(--ink));
}
.tutor-dashboard-header{
  background-color:var(--tutor-surface-base, var(--paper))!important;
  border-color:var(--tutor-border-idle, var(--hairline))!important;
  color:var(--tutor-text-primary, var(--ink))!important;
}

/* ---------- Token bridge: v3 + v4 (follows Quescol --paper/--ink/--card) ---------- */
html:has(body.tutor-frontend),
html:has(body.tutor-screen-frontend-dashboard),
html:has(body.tutor-lms),
html:has(body.qc-tutor-skinned),
html:has(.tutor-dashboard-layout),
body.tutor-frontend,
body.tutor-screen-frontend-dashboard,
body.tutor-lms,
body.qc-tutor-skinned,
body:has(.tutor-dashboard-layout){
  --tutor-color-primary: var(--pen);
  --tutor-color-primary-hover: var(--pen-deep);
  --tutor-color-primary-rgb: 224, 58, 69;
  --tutor-body-color: var(--ink);
  --tutor-body-background: var(--paper);
  --tutor-border-color: var(--hairline-strong);
  --tutor-border-idle: var(--hairline-strong);
  --tutor-border-hover: var(--ink-mute);
  --tutor-border-brand: var(--pen);
  --tutor-color-gray: var(--hairline);
  --tutor-color-gray-10: var(--paper);
  --tutor-color-secondary: var(--ink-mute);
  --tutor-color-subdued: var(--ink-mute);
  --tutor-color-hints: var(--ink-mute);
  --tutor-color-muted: var(--ink-mute);
  --tutor-color-white: var(--card);
  --tutor-surface-base: var(--paper);
  --tutor-surface-l1: var(--card);
  --tutor-surface-l1-hover: var(--paper);
  --tutor-surface-l2: var(--paper);
  --tutor-surface-l2-hover: var(--hairline);
  --tutor-surface-l3: var(--paper);
  --tutor-surface-sidebar-l1: var(--card);
  --tutor-surface-brand-tertiary: var(--pen-wash);
  --tutor-text-primary: var(--ink);
  --tutor-text-secondary: var(--ink-mute);
  --tutor-text-subdued: var(--ink-mute);
  --tutor-text-brand: var(--pen);
  --tutor-text-brand-hover: var(--pen-deep);
  --tutor-icon-idle: var(--ink-mute);
  --tutor-icon-hover: var(--ink);
  --tutor-icon-secondary: var(--ink-mute);
  --tutor-tab-sidebar-l2-hover: var(--paper);
  --tutor-tab-sidebar-l2-active: var(--pen-wash);
}
body.tutor-frontend,
body.tutor-screen-frontend-dashboard,
body.tutor-lms,
body.qc-tutor-skinned,
body:has(.tutor-dashboard-layout){
  background-color: var(--paper) !important;
  color: var(--ink);
  font-family: var(--body);
}
html[data-theme="dark"]:has(body.tutor-frontend),
html[data-theme="dark"]:has(body.tutor-screen-frontend-dashboard),
html[data-theme="dark"]:has(body.tutor-lms),
html[data-theme="dark"]:has(body.qc-tutor-skinned),
html[data-theme="dark"]:has(.tutor-dashboard-layout),
html[data-theme="dark"] body.tutor-frontend,
html[data-theme="dark"] body.tutor-screen-frontend-dashboard,
html[data-theme="dark"] body.tutor-lms,
html[data-theme="dark"] body.qc-tutor-skinned,
html[data-tutor-theme="dark"]{
  --tutor-color-primary-rgb: 240, 69, 80;
  --tutor-surface-base: var(--paper);
  --tutor-surface-l1: var(--card);
  --tutor-surface-l1-hover: var(--paper);
  --tutor-surface-l2: var(--paper);
  --tutor-surface-l3: var(--paper);
  --tutor-surface-sidebar-l1: var(--card);
  --tutor-text-primary: var(--ink);
  --tutor-text-secondary: var(--ink-mute);
  --tutor-text-subdued: var(--ink-mute);
  --tutor-text-brand: var(--pen);
  --tutor-border-idle: var(--hairline-strong);
  --tutor-tab-sidebar-l2-hover: var(--paper);
  --tutor-tab-sidebar-l2-active: var(--pen-wash);
}

/* Keep html background on-brand (Tutor sets surface-base on html) */
html{
  background-color: var(--paper);
}

/* ---------- Layout shell ---------- */
/* Do NOT constrain .tutor-page-wrap / .tutor-course-details-page —
   course singles use Tutor's own .tutor-container + col-xl-8/4 grid. */
.tutor-wrap:not(.tutor-page-wrap):not(.tutor-wrap-parent),
.tutor-dashboard.tutor-wrap{
  max-width:var(--maxw);
  margin:0 auto;
  padding:28px 24px 72px;
  color:var(--ink);
}

/* Course single outer shell — full width; inner .tutor-container sizes itself */
.tutor-full-width-course-top.tutor-page-wrap,
.tutor-wrap-parent.tutor-page-wrap,
body.single-courses .tutor-page-wrap,
body.single-courses .tutor-wrap-parent{
  max-width:none!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
}

/* Clear earlier bad theme max-width on the details container;
   let Tutor's .tutor-container media queries control width. */
body.single-courses .tutor-course-details-page.tutor-container,
.tutor-course-details-page.tutor-container{
  max-width:1140px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}
@media (min-width:1400px){
  body.single-courses .tutor-course-details-page.tutor-container,
  .tutor-course-details-page.tutor-container{
    max-width:1320px;
  }
}

.tutor-dashboard .tutor-container{
  max-width:var(--maxw);
}
.tutor-frontend-dashboard-header{
  background:var(--card);
  border:1px solid var(--hairline);
  border-radius:16px;
  padding:18px 20px;
  margin-bottom:22px;
  box-shadow:var(--shadow);
}
.tutor-dashboard-header-username,
.tutor-dashboard-header-display-name,
.tutor-dashboard-header-greetings,
.tutor-color-black{
  color:var(--ink)!important;
}

/* ---------- Left menu ---------- */
.tutor-dashboard .tutor-dashboard-left-menu{
  background:var(--card);
  border:1px solid var(--hairline-strong);
  border-radius:16px;
  box-shadow:var(--shadow);
  padding:8px 0 12px;
  overflow:hidden;
}
.tutor-dashboard .tutor-dashboard-left-menu .tutor-dashboard-permalinks{
  margin:0!important;
  padding:8px!important;
}
.tutor-dashboard .tutor-dashboard-left-menu .tutor-dashboard-permalinks li a,
.tutor-dashboard .tutor-dashboard-menu-item-link{
  color:var(--ink-mute)!important;
  border-radius:10px!important;
  margin:2px 0;
  transition:background .15s ease,color .15s ease;
}
.tutor-dashboard .tutor-dashboard-left-menu .tutor-dashboard-permalinks li a:hover,
.tutor-dashboard .tutor-dashboard-menu-item-link:hover{
  background:var(--paper)!important;
  color:var(--ink)!important;
}
.tutor-dashboard .tutor-dashboard-left-menu .tutor-dashboard-permalinks li.active a,
.tutor-dashboard .tutor-dashboard-menu-item.active .tutor-dashboard-menu-item-link{
  background:var(--pen-wash)!important;
  color:var(--pen)!important;
  box-shadow:inset 3px 0 0 var(--pen);
}
.tutor-dashboard .tutor-dashboard-menu-divider-header{
  color:var(--pen)!important;
  font-family:var(--mono);
  font-size:11px!important;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.9;
}
.tutor-dashboard .tutor-dashboard-menu-divider{
  border-color:var(--hairline)!important;
}

/* ---------- Content cards ---------- */
.tutor-dashboard-content,
.tutor-dashboard .tutor-card,
.tutor-card,
.tutor-course-card,
.tutor-bs-card,
.tutor-login-form-wrapper,
.tutor-login-wrap,
.tutor-registration-wrap{
  background:var(--card)!important;
  border:1px solid var(--hairline)!important;
  border-radius:var(--radius)!important;
  box-shadow:var(--shadow)!important;
  color:var(--ink)!important;
}
.tutor-dashboard .tutor-card:hover,
.tutor-course-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-lift)!important;
  border-color:var(--hairline-strong)!important;
}
.tutor-dashboard-content h2,
.tutor-dashboard-content h3,
.tutor-fs-4,
.tutor-fs-5,
.tutor-fs-6{
  color:var(--ink);
}
.tutor-dashboard table,
.tutor-table,
.tutor-table td,
.tutor-table th{
  border-color:var(--hairline)!important;
  color:var(--ink);
  background:transparent;
}
.tutor-dashboard .tutor-table thead,
.tutor-table thead th{
  background:var(--paper)!important;
  color:var(--ink-mute)!important;
}

/* ---------- Buttons ---------- */
.tutor-btn-primary,
.tutor-course-enroll-btn,
a.tutor-btn-primary,
button.tutor-btn-primary,
.tutor-dashboard .tutor-btn-primary{
  background:var(--pen)!important;
  border-color:var(--pen)!important;
  border-radius:10px!important;
  font-weight:600!important;
  color:#fff!important;
  box-shadow:0 10px 22px -12px var(--pen);
}
.tutor-btn-primary:hover,
a.tutor-btn-primary:hover{
  background:var(--pen-deep)!important;
  border-color:var(--pen-deep)!important;
}
.tutor-btn-outline-primary,
.tutor-btn-ghost{
  border-color:var(--hairline-strong)!important;
  color:var(--ink)!important;
  background:var(--card)!important;
  border-radius:10px!important;
}
.tutor-btn-outline-primary:hover{
  border-color:var(--pen)!important;
  color:var(--pen)!important;
  background:var(--pen-wash)!important;
}

/* ---------- Forms / login on dashboard ---------- */
.tutor-form-control,
.tutor-dashboard input[type=text],
.tutor-dashboard input[type=email],
.tutor-dashboard input[type=password],
.tutor-dashboard select,
.tutor-dashboard textarea,
.tutor-login-form-wrapper input{
  background:var(--paper)!important;
  border:1.5px solid var(--hairline-strong)!important;
  border-radius:10px!important;
  color:var(--ink)!important;
}
.tutor-form-control:focus,
.tutor-login-form-wrapper input:focus{
  border-color:var(--pen)!important;
  outline:none;
  box-shadow:0 0 0 3px var(--pen-wash);
}
.tutor-login-form-wrapper,
.tutor-login-wrap{
  max-width:440px;
  margin:40px auto;
  padding:28px!important;
}
.tutor-login-form-wrapper h1,
.tutor-login-form-wrapper h2,
.tutor-login-wrap h1,
.tutor-login-wrap h2{
  font-family:var(--display);
  color:var(--ink)!important;
}

/* Google slot spacing on Tutor login */
#tutor-pro-social-authentication{
  border-top:1px solid var(--hairline)!important;
  margin-top:8px;
  padding-top:18px!important;
}

/* ---------- Course archive / single ---------- */
.tutor-course-archive-page .tutor-course-filter,
.tutor-course-archive-page .tutor-course-filter-wrapper{
  background:var(--card);border:1px solid var(--hairline);border-radius:14px;
}
.tutor-course-details-page .tutor-course-sidebar-card,
.tutor-course-details-page .tutor-card.tutor-course-sidebar-card{
  border:1px solid var(--hairline-strong)!important;border-radius:14px!important;
  box-shadow:var(--shadow-lift)!important;
  background:var(--card)!important;
}

/* Wishlist + Share action pills */
.tutor-course-details-actions{
  display:flex!important;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
.tutor-course-details-actions .tutor-btn,
.tutor-course-details-actions .tutor-btn-ghost,
.tutor-course-details-actions .tutor-course-wishlist-btn,
.tutor-course-details-actions .tutor-course-share-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  margin:0!important;
  min-height:40px;
  padding:10px 18px!important;
  border:1.5px solid var(--hairline-strong)!important;
  border-radius:999px!important;
  background:var(--card)!important;
  color:var(--ink)!important;
  font-weight:600!important;
  font-size:14px!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  box-sizing:border-box!important;
  width:auto!important;
  max-width:none!important;
}
.tutor-course-details-actions .tutor-btn:hover,
.tutor-course-details-actions .tutor-btn-ghost:hover,
.tutor-course-details-actions .tutor-course-wishlist-btn:hover,
.tutor-course-details-actions .tutor-course-share-btn:hover{
  border-color:var(--pen)!important;
  color:var(--pen)!important;
  background:var(--pen-wash)!important;
}
.tutor-course-details-actions .tutor-mr-8,
.tutor-course-details-actions .tutor-mr-16,
.tutor-course-details-actions i,
.tutor-course-details-actions [class*="tutor-icon-"]{
  margin:0!important;
  flex:none;
  line-height:1!important;
}
.tutor-course-details-actions .tutor-icon-share,
.tutor-course-details-actions .tutor-icon-bookmark-line,
.tutor-course-details-actions .tutor-icon-bookmark-bold{
  font-size:16px!important;
}

/* Course detail page: restore footer gap; avoid mobile bar / sticky overflow */
body.single-courses #tutor-dashboard-footer-mobile{
  display:none!important;
}
body.single-courses footer.site-footer,
body.single-courses footer.qc-site-footer{
  margin-top:88px!important;
  margin-bottom:0!important;
}

/* CSS-only sticky enroll card — avoids Tutor Pro JS which sets
   max-height:80vh + overflow:scroll and causes huge post-footer whitespace
   when combined with our position:sticky site header. */
@media (min-width:1200px){
  body.single-courses .tutor-col-xl-4{
    align-self:flex-start;
  }
  body.single-courses .tutor-single-course-sidebar{
    position:sticky;
    top:88px;
  }
  body.single-courses .tutor-single-course-sidebar.tutor-sidebar-sticky{
    max-height:none!important;
    overflow:visible!important;
  }
}

/* ---------- Course cards (archive + dashboard) ---------- */
.tutor-course-card,
.tutor-card.tutor-course-card{
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  position:relative;
  border:1px solid var(--hairline)!important;
  border-radius:16px!important;
  background:var(--card)!important;
  box-shadow:0 8px 24px -18px rgba(26,26,30,.35)!important;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.tutor-course-card:hover{
  transform:translateY(-4px);
  border-color:var(--hairline-strong)!important;
  box-shadow:0 18px 40px -22px rgba(26,26,30,.45)!important;
}

.tutor-course-card .tutor-course-thumbnail{
  position:relative;
  margin:0!important;
}
.tutor-course-card .tutor-course-thumbnail a{
  display:block;
}
.qc-course-price-badge{
  position:absolute;
  left:12px;
  top:12px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  max-width:calc(100% - 64px);
  padding:5px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:750;
  line-height:1.2;
  letter-spacing:.01em;
  box-shadow:0 8px 18px -12px rgba(0,0,0,.45);
  pointer-events:none;
}
.qc-course-price-badge.is-free{
  background:var(--pass);
  color:#fff;
}
.qc-course-price-badge.is-paid{
  background:rgba(26,26,30,.88);
  color:#fff;
}
.qc-course-price-badge.is-paid .amount,
.qc-course-price-badge.is-paid del,
.qc-course-price-badge.is-paid ins{
  color:#fff!important;
  background:none!important;
  text-decoration:none;
}
.qc-course-price-badge.is-paid del{
  opacity:.7;
  text-decoration:line-through;
  margin-right:4px;
}
.tutor-course-card .tutor-ratio{
  --tutor-ratio: 16 / 10;
  aspect-ratio:16 / 10;
  overflow:hidden;
  background:linear-gradient(145deg, var(--pen-wash), var(--paper));
}
.tutor-course-card .tutor-card-image-top,
.tutor-course-card .tutor-course-thumbnail img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block;
  transition:transform .35s ease;
}
.tutor-course-card:hover .tutor-card-image-top,
.tutor-course-card:hover .tutor-course-thumbnail img{
  transform:scale(1.04);
}

.tutor-course-card .tutor-course-bookmark{
  position:absolute!important;
  top:12px!important;
  right:12px!important;
  z-index:2;
}
.tutor-course-card .tutor-course-bookmark .tutor-iconic-btn,
.tutor-course-card .save-bookmark-btn{
  width:36px!important;
  height:36px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.92)!important;
  border:1px solid var(--hairline)!important;
  color:var(--ink-mute)!important;
  box-shadow:0 6px 16px -10px rgba(0,0,0,.35);
  backdrop-filter:blur(6px);
}
.tutor-course-card .tutor-course-bookmark .tutor-iconic-btn:hover,
.tutor-course-card .save-bookmark-btn:hover,
.tutor-course-card .save-bookmark-btn .tutor-icon-bookmark-bold{
  color:var(--pen)!important;
  border-color:var(--pen)!important;
}

.tutor-course-card .tutor-card-body{
  display:flex!important;
  flex-direction:column!important;
  gap:10px;
  flex:1 1 auto;
  padding:16px 16px 12px!important;
}

.tutor-course-card .tutor-course-ratings{
  margin:0!important;
}
.tutor-course-card .qc-course-ratings .tutor-ratings{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.tutor-course-card .tutor-ratings-stars{
  color:#F0A202!important;
  letter-spacing:1px;
}
.tutor-course-card .tutor-ratings-average{
  font-weight:700;
  color:var(--ink);
  font-size:13px;
}
.tutor-course-card .tutor-ratings-count{
  color:var(--ink-mute);
  font-size:12.5px;
}

.qc-course-footer-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
  width:100%;
}
.qc-course-footer-price{
  font-family:var(--display);
  font-size:18px;
  font-weight:750;
  letter-spacing:-.02em;
  color:var(--ink);
}
.qc-course-footer-price.is-free{
  color:var(--pass);
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.tutor-course-card .tutor-course-price,
.tutor-course-card .list-item-price .price{
  font-family:var(--display)!important;
  font-size:18px!important;
  font-weight:750!important;
  color:var(--ink)!important;
}

.tutor-course-card .tutor-course-name{
  margin:0!important;
  font-family:var(--display)!important;
  font-size:clamp(17px,1.5vw,19px)!important;
  font-weight:700!important;
  letter-spacing:-.02em;
  line-height:1.3!important;
}
.tutor-course-card .tutor-course-name a{
  color:var(--ink)!important;
  text-decoration:none!important;
}
.tutor-course-card .tutor-course-name a:hover{
  color:var(--pen)!important;
}

.qc-course-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 12px;
  margin-top:2px;
}
.qc-course-meta__cat{
  display:inline-flex;
  align-items:center;
  max-width:100%;
  padding:4px 10px;
  border-radius:999px;
  background:var(--pen-wash);
  color:var(--pen-deep)!important;
  font-size:12px;
  font-weight:650;
  line-height:1.2;
  text-decoration:none!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.qc-course-meta__cat:hover{
  background:var(--pen);
  color:#fff!important;
}
.qc-course-meta__stats{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--ink-mute);
  font-size:12.5px;
  font-weight:550;
}
.qc-course-meta__stat{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.qc-course-meta__stat svg{flex:none;opacity:.85}

/* Hide Tutor's verbose default meta when theme override is present */
.tutor-course-card .tutor-meta{
  display:none!important;
}
.tutor-course-card .qc-course-meta + .tutor-meta,
.tutor-course-card .qc-course-meta ~ .tutor-meta{
  display:none!important;
}

.tutor-course-card .tutor-card-footer{
  margin-top:auto!important;
  padding:12px 16px 16px!important;
  border-top:1px solid var(--hairline)!important;
  background:linear-gradient(180deg, transparent, rgba(26,26,30,.02));
}
.tutor-course-card .list-item-button,
.tutor-course-card .tutor-card-footer > *{
  width:100%;
}
.tutor-course-card .qc-course-cta,
.tutor-course-card .tutor-btn-primary,
.tutor-course-card .tutor-btn-outline-primary{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:100%!important;
  min-height:42px;
  border-radius:11px!important;
  font-weight:700!important;
  letter-spacing:-.01em;
  position:relative;
  overflow:hidden;
}
.tutor-course-card .tutor-btn-outline-primary,
.tutor-course-card .qc-course-cta{
  background:var(--pen)!important;
  border-color:var(--pen)!important;
  color:#fff!important;
  box-shadow:0 10px 22px -14px var(--pen);
}
.tutor-course-card .tutor-btn-outline-primary:hover,
.tutor-course-card .qc-course-cta:hover{
  background:var(--pen-deep)!important;
  border-color:var(--pen-deep)!important;
  color:#fff!important;
  animation:none;
}

/* Soft attention pulse on enroll / start CTAs */
.tutor-course-card .qc-course-cta--pulse,
.tutor-course-card .tutor-course-list-btn .tutor-btn,
.tutor-course-card .list-item-button .tutor-btn{
  animation:qcCourseCtaPulse 2.4s ease-in-out infinite;
}
.tutor-course-card .qc-course-cta--pulse::after,
.tutor-course-card .tutor-course-list-btn .tutor-btn::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);
  transform:translateX(-120%);
  animation:qcCourseCtaShine 2.8s ease-in-out infinite;
  pointer-events:none;
}
@keyframes qcCourseCtaPulse{
  0%,100%{box-shadow:0 10px 22px -14px var(--pen); transform:scale(1)}
  50%{box-shadow:0 14px 28px -10px var(--pen); transform:scale(1.015)}
}
@keyframes qcCourseCtaShine{
  0%,55%{transform:translateX(-120%)}
  100%{transform:translateX(120%)}
}
@media (prefers-reduced-motion:reduce){
  .tutor-course-card .qc-course-cta--pulse,
  .tutor-course-card .tutor-course-list-btn .tutor-btn,
  .tutor-course-card .list-item-button .tutor-btn,
  .tutor-course-card .qc-course-cta--pulse::after,
  .tutor-course-card .tutor-course-list-btn .tutor-btn::after{
    animation:none!important;
  }
}

/* Archive layout polish */
.tutor-course-list,
.tutor-courses-wrap .tutor-row{
  gap:0;
}
.tutor-course-archive-page .tutor-wrap,
.tutor-courses-page .tutor-wrap{
  padding-top:8px;
}
.tutor-course-archive-page h1,
.tutor-courses-page .tutor-course-archive-header h1{
  font-family:var(--display)!important;
  letter-spacing:-.03em;
}

@media (max-width:720px){
  .tutor-course-card .tutor-card-body{padding:14px 14px 10px!important}
  .tutor-course-card .tutor-card-footer{padding:10px 14px 14px!important}
}

/* ---------- Mobile footer nav (legacy Tutor 3 + Tutor 4 tab bar) ---------- */
#tutor-dashboard-footer-mobile{
  background:var(--card)!important;
  border-top:1px solid var(--hairline)!important;
  z-index:10040!important;
}
#tutor-dashboard-footer-mobile a{
  color:var(--ink-mute)!important;
}
#tutor-dashboard-footer-mobile a.active{
  color:var(--pen)!important;
}
.tutor-dashboard-nav-mobile{
  background:var(--card)!important;
  border-top:1px solid var(--hairline)!important;
}
.tutor-dashboard-nav-mobile-list>li>a.active,
.tutor-dashboard-nav-mobile-list>li>a.active span,
.tutor-dashboard-nav-mobile-list>li>button.active,
.tutor-dashboard-nav-mobile-list>li>button.active span{
  color:var(--pen)!important;
}

/* ---------- Misc Tutor utility classes that fight the theme ---------- */
.tutor-bg-white{background-color:var(--card)!important}
.tutor-border{border-color:var(--hairline)!important}
.tutor-color-secondary,
.tutor-color-muted,
.tutor-color-hints,
.tutor-color-subdued{color:var(--ink-mute)!important}

/* ---------- Lesson / course player (was spotlight-dark) ---------- */
body.tutor-lms .tutor-course-single-content-wrapper,
body.tutor-frontend .tutor-course-single-content-wrapper,
.tutor-course-single-content-wrapper,
.tutor-course-single-content-wrapper.tutor-spotlight-mode,
#tutor-page-wrap,
.tutor-site-wrap{
  background:var(--paper)!important;
  color:var(--ink)!important;
}
.tutor-course-single-sidebar-wrapper,
.tutor-course-single-sidebar-content,
.tutor-course-topic-single,
.tutor-course-topic-item,
.tutor-course-single-content-wrapper .tutor-course-topic{
  background:var(--card)!important;
  color:var(--ink)!important;
  border-color:var(--hairline)!important;
}
.tutor-course-single-content-wrapper .tutor-course-single-content-top,
.tutor-course-single-sidebar-title,
.tutor-course-topic-title,
.tutor-course-topic-item.is-active,
.tutor-course-topic-item:hover{
  background:var(--paper)!important;
  color:var(--ink)!important;
}
.tutor-course-topic-item.is-active,
.tutor-course-topic-item.is-active a{
  background:var(--pen-wash)!important;
  color:var(--pen)!important;
}

/* Mobile lesson offcanvas: backdrop + clear close control */
@media (max-width: 1199px){
  .qc-lesson-sidebar-backdrop{
    position:fixed;inset:0;background:rgba(26,26,30,.42);
    z-index:10060;cursor:pointer;
  }
  .qc-lesson-sidebar-backdrop[hidden]{display:none!important}
  .tutor-course-single-content-wrapper.tutor-course-single-sidebar-open .qc-lesson-sidebar-backdrop:not([hidden]){
    display:block;
  }
  .tutor-course-single-sidebar-wrapper{
    position:relative;z-index:10065;
  }
  .qc-lesson-sidebar-head{
    display:flex!important;align-items:center;justify-content:space-between;gap:10px;
    padding:12px 14px;background:var(--card)!important;
    border-bottom:1px solid var(--hairline)!important;
    position:sticky;top:0;z-index:6;
  }
  .qc-lesson-sidebar-head__label{
    font-weight:700;font-size:14px;color:var(--ink);
  }
  .tutor-course-single-content-wrapper.tutor-course-single-sidebar-open .tutor-course-single-sidebar-title{
    position:sticky;
    top:0;
    z-index:4;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    background:var(--card)!important;
    border-bottom:1px solid var(--hairline)!important;
  }
  .tutor-course-single-content-wrapper.tutor-course-single-sidebar-open [tutor-hide-course-single-sidebar],
  .qc-lesson-sidebar-close{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    border-radius:10px;
    border:1px solid var(--hairline-strong);
    background:var(--paper);
    color:var(--ink)!important;
    cursor:pointer;
    flex:none;
    padding:0;
    line-height:1;
  }
  .tutor-course-single-content-wrapper.tutor-course-single-sidebar-open [tutor-hide-course-single-sidebar]:hover,
  .qc-lesson-sidebar-close:hover{
    border-color:var(--pen);
    color:var(--pen)!important;
    background:var(--pen-wash);
  }
}

/* Tutor 4 learning area — mobile curriculum sidebar close */
@media (max-width: 1199px){
  .qc-learning-sidebar-backdrop{
    position:fixed;inset:0;background:rgba(26,26,30,.42);
    z-index:10060;cursor:pointer;
  }
  .qc-learning-sidebar-backdrop[hidden]{display:none!important}
  .tutor-learning-area-body .tutor-learning-sidebar.is-open{
    z-index:10065;
  }
  .qc-learning-curriculum-head{
    display:flex!important;align-items:flex-start;justify-content:space-between;gap:10px;
    padding:12px 14px 10px;background:var(--card)!important;
    border-bottom:1px solid var(--hairline)!important;
    position:sticky;top:0;z-index:6;
  }
  .qc-learning-curriculum-head--solo{
    justify-content:flex-end;padding:10px 14px;
  }
  .qc-learning-curriculum-head .tutor-learning-progress{
    flex:1;min-width:0;margin:0!important;padding:0!important;
    border:0!important;background:transparent!important;
  }
  .qc-learning-sidebar-close{
    display:inline-flex!important;
    align-items:center;justify-content:center;
    width:34px;height:34px;border-radius:10px;
    border:1px solid var(--hairline-strong);
    background:var(--paper);color:var(--ink)!important;
    cursor:pointer;flex:none;padding:0;line-height:1;
  }
  .qc-learning-sidebar-close:hover{
    border-color:var(--pen);color:var(--pen)!important;background:var(--pen-wash);
  }
}
@media (min-width: 1200px){
  .qc-learning-sidebar-close{display:none!important}
}
.tutor-course-spotlight-wrapper,
.tutor-course-spotlight-tab,
.tutor-lesson-content-area,
.tutor-course-spotlight-nav,
.tutor-single-lesson-content,
.tutor-lesson-content,
.tutor-content-wrapper{
  background:var(--paper)!important;
  color:var(--ink)!important;
}
.tutor-course-spotlight-nav .is-active,
.tutor-nav-link.is-active{
  color:var(--pen)!important;
  border-color:var(--pen)!important;
}
.tutor-course-spotlight-wrapper h1,
.tutor-course-spotlight-wrapper h2,
.tutor-lesson-content-area h1,
.tutor-lesson-content-area h2,
.tutor-fs-3,
.tutor-fs-4{
  color:var(--ink)!important;
}
.tutor-course-spotlight-wrapper .custom-toc-wrapper,
.tutor-lesson-content-area .custom-toc-wrapper{
  background:var(--card)!important;
  border-color:var(--hairline-strong)!important;
  box-shadow:var(--shadow)!important;
}
.tutor-course-spotlight-wrapper .custom-toc-toggle,
.tutor-lesson-content-area .custom-toc-toggle{
  background:var(--pen-wash)!important;
  color:var(--ink)!important;
}
.tutor-topbar,
.tutor-course-top-bar,
.tutor-course-single-content-wrapper > .tutor-row:first-child,
.tutor-lesson-top-bar{
  background:var(--card)!important;
  border-bottom:1px solid var(--hairline)!important;
  color:var(--ink)!important;
}
.tutor-topbar a,
.tutor-course-top-bar a,
.tutor-topbar .tutor-course-top-bar-title{
  color:var(--ink)!important;
}
.tutor-mark-lesson-complete,
.tutor-btn.tutor-btn-primary.tutor-topbar-mark-btn{
  background:var(--pen)!important;
  border-color:var(--pen)!important;
  color:#fff!important;
}
/* Progress / sidebar chrome */
.tutor-progress-bar{background:var(--hairline)!important}
.tutor-progress-value{background:var(--pen)!important}
.tutor-single-lesson-segment,
.tutor-quiz-wrapper,
.tutor-course-single-content-wrapper aside{
  background:var(--card)!important;
  color:var(--ink)!important;
  border-color:var(--hairline)!important;
}

/* ---------- Tutor Pro Notes + Tutor 4 learning-area compatibility ---------- */
/*
 * Tutor Pro Notes still relies on Tutor 3 utility classes. Tutor 4 learning-area
 * loads tutor-core.css (not tutor.min.css), so .tutor-d-none is missing and the
 * Take Note popup stays visible at position:fixed; top:0; left:0.
 */
.tutor-d-none{display:none!important}
.tutor-d-block{display:block!important}
.tutor-d-flex{display:flex!important}
.tutor-d-inline-flex{display:inline-flex!important}
.tutor-d-inline-block{display:inline-block!important}
[x-cloak]{display:none!important}

/* Keep floating Take Note popup above site chrome when opened */
.tutor-lesson-note-form-wrapper:not(.tutor-d-none){
  z-index:10060!important;
  background:var(--card,#fff)!important;
  border-color:var(--hairline-strong, #e5e7eb)!important;
  color:var(--ink)!important;
  box-shadow:var(--shadow-lift, 0 12px 32px rgba(0,0,0,.14))!important;
  max-width:min(400px, calc(100vw - 32px));
}
.tutor-lesson-note-form-wrapper .tutor-form-control,
.tutor-lesson-note-form-wrapper textarea{
  background:var(--paper)!important;
  color:var(--ink)!important;
  border-color:var(--hairline-strong)!important;
}
.tutor-lesson-note-form-wrapper .tutor-btn-primary{
  background:var(--pen)!important;
  border-color:var(--pen)!important;
  color:#fff!important;
}
#tutor-lesson-nav-take-note-btn{
  margin-left:auto;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
#tutor-lesson-nav-take-note-btn:not(.tutor-d-none){
  display:inline-flex!important;
}
#tutor-course-spotlight-notes .tutor-course-spotlight-notes{
  max-width:720px;
  margin:0 auto;
}
.tutor-notes-tab-content-form{
  background:var(--card);
  border:1px solid var(--hairline);
  border-radius:14px;
  padding:16px;
  margin-bottom:20px;
}

/* ---------- Dashboard sidebar expand / minimize ---------- */
.qc-dash-sidebar__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border-bottom:1px solid var(--tutor-border-idle, var(--hairline));
  min-height:80px;
  padding:12px 12px 12px 16px;
}
.qc-dash-sidebar__top .tutor-dashboard-sidebar-logo{
  border-bottom:0!important;
  height:auto!important;
  padding:0!important;
  flex:1;
  min-width:0;
}
.qc-dash-sidebar-toggle{
  flex:0 0 auto;
  width:36px;
  height:36px;
  border-radius:10px;
  border:1px solid var(--hairline-strong);
  background:var(--paper);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, transform .2s ease;
}
.qc-dash-sidebar-toggle:hover{
  background:var(--pen-wash);
  border-color:var(--pen);
  color:var(--pen);
}
.qc-dash-sidebar-toggle__icon{
  display:inline-flex;
  transition:transform .2s ease;
}
.tutor-dashboard-layout{
  transition:grid-template-columns .22s ease;
}
html.qc-sidebar-pref-collapsed .tutor-dashboard-layout{
  grid-template-columns:72px 1fr!important;
}
.tutor-dashboard-layout.qc-sidebar-collapsed{
  grid-template-columns:72px 1fr!important;
}
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-dashboard-sidebar{
  width:72px;
  overflow:hidden;
}
.tutor-dashboard-layout.qc-sidebar-collapsed .qc-dash-sidebar__top{
  flex-direction:column;
  justify-content:center;
  padding:12px 8px;
  gap:10px;
}
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-dashboard-sidebar-logo,
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-dashboard-sidebar-logo img,
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-dashboard-sidebar-logo .site-title,
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-dashboard-sidebar-nav a span,
.tutor-dashboard-layout.qc-sidebar-collapsed .qc-dash-sidebar__explore-label{
  display:none!important;
}
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-dashboard-sidebar-nav{
  padding:12px 8px!important;
}
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-dashboard-sidebar-nav ul li a{
  justify-content:center!important;
  padding-left:0!important;
  padding-right:0!important;
}
.tutor-dashboard-layout.qc-sidebar-collapsed .tutor-see-all-courses{
  justify-content:center!important;
  width:calc(100% - 16px)!important;
  left:8px!important;
  padding-left:0!important;
  padding-right:0!important;
}
.tutor-dashboard-layout.qc-sidebar-collapsed .qc-dash-sidebar-toggle__icon{
  transform:rotate(180deg);
}
.screen-reader-text{
  border:0;
  clip:rect(1px,1px,1px,1px);
  clip-path:inset(50%);
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  width:1px;
  white-space:nowrap;
}
@media (max-width:991px){
  .qc-dash-sidebar-toggle{display:none!important}
}
