/* =========================================================
   TEST MASTER PREP ACADEMY — Course / Lesson / Quiz v16
   Presentation only. Functional output comes from Course Manager.
========================================================= */

.tma{
  --tma-blue:#0077B6;
  --tma-blue-dark:#005F92;
  --tma-deep:#123C69;
  --tma-teal:#00A896;
  --tma-red:#E63946;
  --tma-orange:#F77F00;
  --tma-text:#1A202C;
  --tma-muted:#5B677A;
  --tma-border:#D9E4EA;
  --tma-soft:#F3FAFF;
  --tma-soft-green:#F3FFFC;
  --tma-white:#FFFFFF;
  --tma-radius:20px;
  --tma-shadow:0 14px 36px rgba(18,60,105,.08);
  --tma-sticky-top:88px;
  width:100%;
  max-width:100%;
  color:var(--tma-text);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  line-height:1.72;
  overflow-x:clip;
  background:
    radial-gradient(circle at 5% 7%,rgba(230,57,70,.06),transparent 28%),
    radial-gradient(circle at 95% 12%,rgba(0,168,150,.07),transparent 31%),
    linear-gradient(180deg,#fff 0%,#F8FCFF 46%,#fff 100%);
}
.tma *,.tma *::before,.tma *::after{box-sizing:border-box}
.tma img,.tma svg,.tma video,.tma iframe{max-width:100%;height:auto}
.tma a{color:var(--tma-blue)}
.tma-wrap{width:min(1260px,calc(100% - 40px));margin:0 auto}
.tma h1,.tma h2,.tma h3,.tma h4{color:var(--tma-deep);line-height:1.16}
.tma h1{font-size:clamp(34px,4.7vw,58px);letter-spacing:-.035em;margin:12px 0 14px}
.tma h2{font-size:clamp(26px,3vw,38px);letter-spacing:-.025em}
.tma p:last-child{margin-bottom:0}

.tma-hero{
  padding:52px 0 48px;
  background:
    radial-gradient(circle at 8% 9%,rgba(230,57,70,.15),transparent 29%),
    radial-gradient(circle at 90% 8%,rgba(247,127,0,.13),transparent 31%),
    radial-gradient(circle at 82% 100%,rgba(0,168,150,.15),transparent 34%),
    linear-gradient(180deg,#FFF9FA 0%,#F5FAFF 48%,#EEFFFB 100%);
  border-top:5px solid var(--tma-teal);
}
.tma-eyebrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:7px 12px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--tma-blue),var(--tma-teal));
  color:#fff;
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  box-shadow:0 7px 18px rgba(0,119,182,.12);
}

.tma .zcm-template-title{margin:12px 0 14px!important}
.tma .zcm-template-title h1,
.tma h1.zcm-template-title{margin:0!important;color:var(--tma-deep)!important}
.tma .zcm-template-meta,
.tma .zcm-template-course-meta,
.tma .zcm-template-lesson-meta,
.tma .zcm-template-quiz-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:9px!important;
  margin:16px 0 0!important;
}
.tma .zcm-template-meta-item{
  display:inline-flex!important;
  align-items:center!important;
  min-height:32px!important;
  padding:6px 11px!important;
  border:1px solid rgba(18,60,105,.14)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.74)!important;
  color:var(--tma-deep)!important;
  text-decoration:none!important;
  font-size:12px!important;
  font-weight:800!important;
}
.tma a.zcm-template-meta-item:hover{border-color:var(--tma-blue)!important;color:var(--tma-blue)!important}

.tma-hero-actions{display:flex;flex-wrap:wrap;gap:11px;align-items:center;margin-top:24px}
.tma-hero-actions>div{margin:0!important}
.tma .zcm-start-btn,
.tma-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:44px!important;
  padding:11px 18px!important;
  border-radius:10px!important;
  text-decoration:none!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:900!important;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.tma .zcm-start-btn{
  background:linear-gradient(90deg,var(--tma-blue),#0588C5)!important;
  color:#fff!important;
  box-shadow:0 9px 22px rgba(0,119,182,.18)!important;
}
.tma .zcm-start-btn:hover{background:var(--tma-blue-dark)!important;transform:translateY(-1px)}
.tma-btn-light{background:#fff!important;color:var(--tma-blue)!important;border:1px solid rgba(18,60,105,.14)!important}
.tma-btn-light:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(18,60,105,.08)}

.tma-section{padding:46px 0}
.tma-section-soft{
  border-top:1px solid rgba(18,60,105,.08);
  background:linear-gradient(180deg,rgba(243,250,255,.62),rgba(243,255,252,.58));
}
.tma-section-head{max-width:780px;margin-bottom:22px}
.tma-section-head h2{margin:10px 0 7px}
.tma-section-head p{margin:0;color:var(--tma-muted)}

.tma-panel{
  background:rgba(255,255,255,.94);
  border:1px solid var(--tma-border);
  border-radius:var(--tma-radius);
  box-shadow:var(--tma-shadow);
}
.tma-content-panel{padding:clamp(24px,3.6vw,44px);min-width:0}
.tma-main{min-width:0}
.tma .zcm-template-content{font-size:16px;line-height:1.78}
.tma .zcm-template-content>:first-child{margin-top:0}
.tma .zcm-template-content>:last-child{margin-bottom:0}
.tma .zcm-template-content h2{margin-top:1.8em}
.tma .zcm-template-content h3{margin-top:1.5em}
.tma .zcm-template-content table,
.tma .wp-block-table{display:block;max-width:100%;overflow-x:auto}
.tma .zcm-template-content pre{max-width:100%;overflow-x:auto}
.tma .zcm-template-content code{overflow-wrap:anywhere}
.tma-course-content-panel>.zcm-template-content{max-width:100%}

.tma-curriculum{padding:22px}
.tma .zartom-course-nav,
.tma .zcm-course-nav{max-width:100%;background:transparent!important}
.tma .zartom-course-nav ul,
.tma .zcm-course-nav ul{margin-left:0!important;padding-left:0!important;list-style:none!important}
.tma .zartom-course-nav li,
.tma .zcm-course-nav li{margin:0}
.tma .zartom-course-nav a,
.tma .zcm-course-nav a{text-decoration:none}

.tma .zcm-item{
  border-radius:12px!important;
  border-color:rgba(18,60,105,.10)!important;
  box-shadow:none!important;
}
.tma .zcm-item:hover{
  border-color:rgba(0,119,182,.22)!important;
  background:linear-gradient(135deg,#fff 0%,#EEF9FF 52%,#F7FFFD 100%)!important;
}
.tma .zcm-item.is-active{
  border-color:rgba(0,168,150,.35)!important;
  background:linear-gradient(135deg,#fff 0%,#E3F8F3 48%,#F8FFFD 100%)!important;
  box-shadow:inset 4px 0 0 var(--tma-teal)!important;
}
.tma .zcm-item.is-active .zcm-lesson-no-stacked{color:var(--tma-teal)!important;font-weight:900!important}
.tma .zcm-item.is-active .zcm-lesson-title{color:var(--tma-deep)!important;font-weight:900!important}

/* Softer quiz entries inside the course navigator.
   Keep them visually distinct from lessons without the strong orange/cream contrast. */
.tma-course-scroll .zcm-quiz-item{
  background:linear-gradient(135deg,#FBFDFF 0%,#EFF8FC 48%,#F1FBF8 100%)!important;
  border-color:rgba(0,119,182,.13)!important;
  box-shadow:inset 3px 0 0 rgba(0,168,150,.20)!important;
}
.tma-course-scroll .zcm-quiz-item:hover{
  background:linear-gradient(135deg,#FFFFFF 0%,#EAF6FB 52%,#ECFAF6 100%)!important;
  border-color:rgba(0,168,150,.24)!important;
  box-shadow:inset 3px 0 0 rgba(0,168,150,.34)!important;
}
.tma-course-scroll .zcm-quiz-item .zcm-quiz-badge,
.tma-course-scroll .zcm-quiz-item .zcm-quiz-icon{
  color:#397386!important;
}
.tma-course-scroll .zcm-quiz-item .zcm-lesson-title{
  color:var(--tma-deep)!important;
}
.tma-course-scroll .zcm-quiz-item.is-active{
  background:linear-gradient(135deg,#FFFFFF 0%,#E5F6F3 48%,#F2FBFA 100%)!important;
  border-color:rgba(0,168,150,.32)!important;
  box-shadow:inset 4px 0 0 rgba(0,168,150,.55)!important;
}

/* Lesson: Jupiter-style bounded navigation rail.
   The OUTER rail stays in normal document flow and spans the lesson.
   Only the INNER navigator is sticky, so it remains below the site header
   and naturally stops at the bottom of the lesson shell. */
.tma-lesson-shell{
  display:grid;
  grid-template-columns:minmax(245px,285px) minmax(0,1fr);
  align-items:stretch;
  width:100%;
}
.tma-lesson-rail{
  position:relative!important;
  top:auto!important;
  align-self:stretch!important;
  height:auto!important;
  min-height:100%;
  overflow:visible;
  padding:16px 12px 18px 18px;
  background:linear-gradient(180deg,#F5FAFF 0%,#F3FBFF 46%,#F2FFFB 100%);
  border-right:1px solid rgba(18,60,105,.10);
}
.tma-lesson-rail>.tma-course-scroll{
  position:sticky!important;
  top:var(--tma-sticky-top,88px)!important;
  width:100%!important;
  height:auto!important;
  max-height:calc(100dvh - var(--tma-sticky-top,88px) - 16px)!important;
  min-height:0;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:12px!important;
  box-shadow:none!important;
  background:transparent!important;
  border:0!important;
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
.tma-course-scroll .zcm-title,
.tma-course-scroll .zcm-title-link{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  font-size:13px!important;
  line-height:1.28!important;
}
.tma-course-scroll .zcm-lesson-title,
.tma-course-scroll .zcm-link{font-size:13px!important;line-height:1.32!important}
.tma-course-scroll .zcm-lesson-no-stacked{font-size:11px!important}
.tma-lesson-column{min-width:0}
.tma-lesson-content-panel{width:100%;min-width:0}
.tma-lesson-content-panel .zcm-template-content>p,
.tma-lesson-content-panel .zcm-template-content>ul,
.tma-lesson-content-panel .zcm-template-content>ol{max-width:900px}
.tma-bottom-nav{margin-top:24px;min-width:0}

/* Quiz: intentionally centered with no course sidebar */
.tma-quiz-hero-wrap{max-width:980px}
.tma-quiz-main{width:min(980px,100%);margin:0 auto}
.tma-quiz-panel{width:100%}
.tma .zartom-quiz,
.tma .zcm-quiz,
.tma-quiz-panel form{max-width:100%}
.tma-quiz-panel input,
.tma-quiz-panel select,
.tma-quiz-panel textarea{max-width:100%}

/* Divi wrappers must not constrain Course Manager templates. */
body.single-zartom_course .et_pb_section:has(.tma),
body.single-zartom_lesson .et_pb_section:has(.tma),
body.single-zartom_quiz .et_pb_section:has(.tma),
body.single-zartom_course .et_pb_row:has(.tma),
body.single-zartom_lesson .et_pb_row:has(.tma),
body.single-zartom_quiz .et_pb_row:has(.tma),
body.single-zartom_course .et_pb_column:has(.tma),
body.single-zartom_lesson .et_pb_column:has(.tma),
body.single-zartom_quiz .et_pb_column:has(.tma),
body.single-zartom_course .et_pb_code:has(.tma),
body.single-zartom_lesson .et_pb_code:has(.tma),
body.single-zartom_quiz .et_pb_code:has(.tma),
body.single-zartom_course .et_pb_code_inner:has(.tma),
body.single-zartom_lesson .et_pb_code_inner:has(.tma),
body.single-zartom_quiz .et_pb_code_inner:has(.tma){
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
}
body.single-zartom_course .et_pb_section:has(.tma)>.et_pb_row,
body.single-zartom_lesson .et_pb_section:has(.tma)>.et_pb_row,
body.single-zartom_quiz .et_pb_section:has(.tma)>.et_pb_row{
  width:100%!important;
  max-width:100%!important;
  padding:0!important;
}

/* Tablet/mobile */
@media(max-width:979px){
  .tma-lesson-shell{display:flex;flex-direction:column}
  .tma-lesson-rail{
    order:0;
    position:relative;
    top:auto;
    width:100%;
    height:auto;
    max-height:none;
    padding:14px 16px;
    border-right:0;
    border-bottom:1px solid rgba(18,60,105,.10);
  }
  .tma-lesson-rail>.tma-course-scroll{
    position:static!important;
    top:auto!important;
    height:auto!important;
    max-height:360px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  .tma-lesson-column{order:1;width:100%}
}
@media(max-width:766px){
  .tma-wrap{width:calc(100% - 28px)}
  .tma-hero{padding:36px 0 34px}
  .tma-section{padding:34px 0}
  .tma-content-panel{padding:22px 17px}
  .tma-hero-actions{flex-direction:column;align-items:stretch}
  .tma-hero-actions>*,
  .tma-hero-actions>div,
  .tma .zcm-start-btn,
  .tma-btn{width:100%!important}
  .tma .zcm-template-meta-item{font-size:11px!important}
}
@media(prefers-reduced-motion:reduce){
  .tma *{scroll-behavior:auto!important;transition:none!important}
}

/* =========================================================
   TMP ACADEMY LESSON NAVIGATION DOCK — BODY PORTAL
   Divi may create transformed/contained ancestors that prevent
   sticky/fixed positioning from behaving relative to the viewport.
   The companion JS moves .tma-course-scroll to <body> on desktop.
========================================================= */
.tma-course-nav-portal{
  position:relative!important;
  z-index:9990!important;
}
.tma-course-nav-portal .tma-course-scroll{
  position:fixed!important;
  z-index:9990!important;
  margin:0!important;
  max-width:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  background:linear-gradient(180deg,#F5FAFF 0%,#F3FBFF 46%,#F2FFFB 100%)!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:14px 12px!important;
}
.tma-course-nav-portal .tma-course-scroll > .zcm-course-nav,
.tma-course-nav-portal .tma-course-scroll > .zartom-course-nav{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
}
.tma-course-nav-portal .tma-course-scroll.tma-nav-no-room{
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Portal-specific scrollbar polish. */
.tma-course-nav-portal .tma-course-scroll,
.tma-lesson-page .tma-course-scroll{
  scrollbar-width:thin;
  scrollbar-color:rgba(18,60,105,.34) rgba(0,168,150,.06);
}
.tma-course-nav-portal .tma-course-scroll::-webkit-scrollbar,
.tma-lesson-page .tma-course-scroll::-webkit-scrollbar{width:9px}
.tma-course-nav-portal .tma-course-scroll::-webkit-scrollbar-thumb,
.tma-lesson-page .tma-course-scroll::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(18,60,105,.36),rgba(0,168,150,.28));
  border-radius:999px;
  border:2px solid rgba(255,255,255,.42);
  background-clip:padding-box;
}
.tma-course-nav-portal .tma-course-scroll::-webkit-scrollbar-track,
.tma-lesson-page .tma-course-scroll::-webkit-scrollbar-track{
  background:linear-gradient(180deg,rgba(0,119,182,.045),rgba(0,168,150,.06));
  border-radius:999px;
}

/* Softer quiz cards: calm aqua/blue instead of orange/cream.
   Duplicate selectors cover BOTH original lesson DOM and body portal DOM. */
.tma-lesson-page .tma-course-scroll .zcm-quiz-item,
.tma-course-nav-portal .tma-course-scroll .zcm-quiz-item{
  background:linear-gradient(135deg,#FFFFFF 0%,#EEF8FB 48%,#F2FBF8 100%)!important;
  border-color:rgba(0,119,182,.12)!important;
  box-shadow:inset 3px 0 0 rgba(0,168,150,.18)!important;
}
.tma-lesson-page .tma-course-scroll .zcm-quiz-item:hover,
.tma-course-nav-portal .tma-course-scroll .zcm-quiz-item:hover{
  background:linear-gradient(135deg,#FFFFFF 0%,#E9F6FA 48%,#ECF9F5 100%)!important;
  border-color:rgba(0,168,150,.23)!important;
  box-shadow:inset 3px 0 0 rgba(0,168,150,.34)!important;
}
.tma-lesson-page .tma-course-scroll .zcm-quiz-item .zcm-quiz-badge,
.tma-course-nav-portal .tma-course-scroll .zcm-quiz-item .zcm-quiz-badge,
.tma-lesson-page .tma-course-scroll .zcm-quiz-item .zcm-quiz-icon,
.tma-course-nav-portal .tma-course-scroll .zcm-quiz-item .zcm-quiz-icon{
  color:#3E7887!important;
}
.tma-lesson-page .tma-course-scroll .zcm-quiz-item .zcm-lesson-title,
.tma-course-nav-portal .tma-course-scroll .zcm-quiz-item .zcm-lesson-title{
  color:#173E61!important;
}
.tma-lesson-page .tma-course-scroll .zcm-quiz-item.is-active,
.tma-course-nav-portal .tma-course-scroll .zcm-quiz-item.is-active{
  background:linear-gradient(135deg,#FFFFFF 0%,#E2F4F1 48%,#F2FBF9 100%)!important;
  border-color:rgba(0,168,150,.30)!important;
  box-shadow:inset 4px 0 0 rgba(0,168,150,.52)!important;
}

/* On smaller screens the navigator remains in normal flow. */
@media(max-width:979px){
  .tma-course-nav-portal{display:none!important}
}

/* Final rail ownership guard: outer rail never becomes viewport-sticky.
   The body portal owns desktop docking. */
@media(min-width:980px){
  .tma-lesson-page .tma-lesson-rail{
    position:relative!important;
    top:auto!important;
    height:auto!important;
    min-height:100%!important;
    overflow:visible!important;
  }
  .tma-lesson-page .tma-lesson-rail > .tma-course-scroll{
    position:relative!important;
    top:auto!important;
    height:auto!important;
    max-height:none!important;
  }
}