.elementor-kit-714{--e-global-color-primary:#2D4858;--e-global-color-secondary:#C1F72A;--e-global-color-text:#7A7A7A;--e-global-color-accent:#9EE492;--e-global-color-3e0d0ea:#E6E5DE;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-714 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */:root{
  --gs-app-bg: #2f5561;
  --gs-accent: #b6ff6a;      /* neon green */
  --gs-bar-bg: rgba(255,255,255,0.16);
  --gs-card-bg: rgba(255,255,255,0.08);
  --gs-card-border: rgba(255,255,255,0.14);
}


/* ===== GETT SMART Quiz Review UI ===== */
.gs-review {
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 16px;
  background: #ffffff;
  margin-top: 16px;
}

.gs-review__header {
  padding-bottom: 12px;
  border-bottom: 1px solid #f3f4f6;
  margin-bottom: 12px;
}

.gs-review__title {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
}

.gs-review__subtitle {
  margin: 6px 0 0 0;
  font-size: 14px;
  color: #6b7280;
}

.gs-review__list {
  display: grid;
  gap: 12px;
}

.gs-review__card {
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 12px;
  background: #fff;
}

.gs-review__card.is-correct {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.gs-review__card.is-wrong {
  border-color: #fecaca;
  background: #fff7ed;
}

.gs-review__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.gs-review__num {
  font-weight: 800;
  font-size: 12px;
  color: #111827;
  background: #f3f4f6;
  padding: 6px 10px;
  border-radius: 999px;
}

.gs-review__badge {
  font-weight: 800;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  color: #111827;
  background: #e5e7eb;
}

.gs-review__card.is-correct .gs-review__badge {
  background: #bbf7d0;
}

.gs-review__card.is-wrong .gs-review__badge {
  background: #fed7aa;
}

.gs-review__question {
  font-size: 15px;
  font-weight: 800;
  color: #111827;
  margin-bottom: 10px;
}

.gs-review__row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 10px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(17,24,39,0.06);
  margin-top: 10px;
}

.gs-review__label {
  font-size: 12px;
  font-weight: 800;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.gs-review__value {
  font-size: 14px;
  font-weight: 700;
  color: #111827;
}

.gs-review__good {
  margin-top: 10px;
  font-size: 14px;
  font-weight: 700;
  color: #166534;
}

/* Mobile tweaks */
@media (max-width: 480px) {
  .gs-review { padding: 12px; }
  .gs-review__row { grid-template-columns: 1fr; }
  .gs-review__label { margin-bottom: -4px; }
}

/* Toggle (details/summary) */
.gs-review__toggle {
  margin-top: 10px;
  border-radius: 12px;
  border: 1px solid rgba(17,24,39,0.08);
  background: rgba(255,255,255,0.7);
  overflow: hidden;
}

.gs-review__summary {
  list-style: none;
  cursor: pointer;
  font-weight: 800;
  font-size: 13px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Remove default triangle marker (Chrome/Safari) */
.gs-review__summary::-webkit-details-marker {
  display: none;
}

/* Custom chevron */
.gs-review__summary::after {
  content: "▾";
  font-size: 14px;
  opacity: 0.8;
  transition: transform 0.18s ease;
}

.gs-review__toggle[open] .gs-review__summary::after {
  transform: rotate(180deg);
}

.gs-review__details-body {
  padding: 12px;
  border-top: 1px solid rgba(17,24,39,0.06);
}

/* ===== GETT SMART Chapter Bubble UI ===== */

:root{
  --gs-bubble-image: url("https://gettsmartapp.com/wp-content/uploads/2025/12/bubbleonly.png");
}


.gs-chapter-ui{
  width: 100%;
  min-height: calc(100vh - 80px); /* fills screen below header */
  margin: 0;
  padding: 40px 24px 60px;
  border-radius: 0;
  background: #2f5561; /* your app blue */
}


/* Header */
.gs-chapter-ui__header{
  margin-top: 10px;
  margin-bottom: 36px;
}


.gs-chapter-ui__title{
  margin: 0;
  font-weight: 900;
  letter-spacing: .5px;
  font-size: 44px;
  /* app-like chalk vibe */
  font-family: "Chalkboard SE","Comic Sans MS","Trebuchet MS",system-ui,sans-serif;
  color: #b6ff6a; /* neon green app style */
  text-shadow: 0 2px 0 rgba(0,0,0,.25);
}

.gs-chapter-ui__subtitle{
  margin-top: 10px;
  font-size: 14px;
  color: rgba(255,255,255,.75);
}

/* Background feel (optional) */
.gs-chapter-ui{
  border-radius: 22px;
  background: #2f5561; /* teal like app */
}

/* Grid */
.gs-bubble-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px 28px;
  align-items: start;
}

/* Bubble card clickable */
.gs-bubble-item{
  text-decoration:none !important;
  color: #e5e7eb;
  display:flex;
  flex-direction: column;
  align-items:center;
  gap: 10px;
  padding: 6px 6px 10px;
  border-radius: 16px;
}

/* Bubble itself */
.gs-bubble{
  width: 130px;
  height: 130px;
  border-radius: 999px;
  position: relative;

  /* ✅ Replace this background-image with your bubble asset URL */
  background-image: var(--gs-bubble-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  /* fallback if image not set */
  background-color: rgba(255,255,255,.10);
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
}

.gs-bubble__num{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 44px;
  font-weight: 900;
  color: rgba(255,255,255,.92);
  text-shadow: 0 2px 0 rgba(0,0,0,.25);
}

/* Lesson title under bubble */
.gs-bubble-item__title{
  text-align:center;
  font-family: "Chalkboard SE","Comic Sans MS","Trebuchet MS",system-ui,sans-serif;
  font-size: 14px;
  line-height: 1.2;
  max-width: 180px;
  color: rgba(255,255,255,.85);
}

/* Completed “pop” effect */
.gs-bubble-item.is-completed .gs-bubble{
  animation: gsPop .35s ease-out;
  outline: 3px solid rgba(182,255,106,.55);
}

@keyframes gsPop{
  0%{ transform: scale(.92); }
  60%{ transform: scale(1.05); }
  100%{ transform: scale(1); }
}

/* Hover */
.gs-bubble-item:hover{
  background: rgba(255,255,255,.06);
}

/* Mobile */
@media (max-width: 900px){
  .gs-bubble-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gs-chapter-ui__title{ font-size: 34px; }
}
@media (max-width: 520px){
  .gs-bubble-grid{ grid-template-columns: 1fr; }
  .gs-bubble{ width: 150px; height:150px; }
}

/* Chapter progress header (matches bubble screen) */
.gs-chapter-progress{
  max-width: 980px;
  margin: 14px auto 14px;
  padding: 14px 14px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  color: rgba(255,255,255,0.92);
}

.gs-chapter-progress__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}

.gs-chapter-progress__label{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .85;
}

.gs-chapter-progress__count{
  font-size: 14px;
  font-weight: 700;
  margin-top: 2px;
}

.gs-chapter-progress__btn{
  text-decoration:none !important;
  background: #b6ff6a;
  color: #102a2f !important;
  font-weight: 900;
  padding: 10px 16px;
  border-radius: 999px;
  box-shadow: 0 10px 18px rgba(0,0,0,.2);
}


.gs-bubble-grid{
  justify-items: center;
  align-items: start;
}

/* Continue card (fits app-style chapter screen) */
.gs-continue-card{
  max-width: 980px;
  margin: 0 auto 18px;
  padding: 14px 14px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  color: rgba(255,255,255,0.92);
}

.gs-continue-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}

.gs-continue-title{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .9;
}

.gs-continue-sub{
  margin-top: 4px;
  font-size: 15px;
  font-weight: 800;
  font-family: "Chalkboard SE","Comic Sans MS",system-ui,sans-serif;
}

.gs-continue-btn{
  text-decoration:none !important;
  background: #b6ff6a;
  color: #102a2f !important;
  font-weight: 900;
  padding: 10px 16px;
  border-radius: 999px;
  box-shadow: 0 10px 18px rgba(0,0,0,.2);
  white-space: nowrap;
}


.gs-continue-meta{
  margin-top: 8px;
  font-size: 12px;
  font-weight: 800;
  opacity: .85;
}

.gs-continue-bar,
.gs-chapter-progress__bar{
  background: var(--gs-bar-bg);
}

.gs-continue-fill,
.gs-chapter-progress__fill{
  background: var(--gs-accent);
}

.gs-chapter-progress{
  width: 100%;
  max-width: none;
  margin: 0 0 18px;
}

.gs-back-chapters a{
  display:inline-block;
  color: rgba(255,255,255,0.92) !important;
  text-decoration:none !important;
  font-weight: 800;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.06);
}
.gs-back-chapters a:hover{
  background: rgba(255,255,255,0.10);
}
/* FORCE the Continue progress bar to show */
.gs-continue-card .gs-continue-bar{
  display: block !important;
  width: 100% !important;
  height: 10px !important;
  margin-top: 10px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.16) !important;
  overflow: hidden !important;
  position: relative !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.gs-continue-card .gs-continue-fill{
  display: block !important;
  height: 100% !important;
  width: 50%; /* fallback if inline width gets stripped */
  background: #b6ff6a !important;
  border-radius: 999px !important;
}

/* ===== GETT SMART All Chapters UI ===== */

:root{
  --gs-app-bg: #2f5561;
  --gs-accent: #b6ff6a;
  --gs-bubble-image: url("https://gettsmartapp.com/wp-content/uploads/2025/12/bubbleonly.png"); /* your bubble-only image */
}

/* Full-screen app background just for this component */
.gs-all-chapters-ui{
  width: 100%;
  min-height: 100vh;
  background: var(--gs-app-bg);
  padding: 40px 20px 70px;
  border-radius: 0;
}

/* Header */
.gs-all-chapters-ui__header{
  text-align: center;
  margin-bottom: 28px;
}

.gs-all-chapters-ui__title{
  margin: 0;
  font-weight: 900;
  letter-spacing: .5px;
  font-size: 44px;
  font-family: "Chalkboard SE","Comic Sans MS","Trebuchet MS",system-ui,sans-serif;
  color: var(--gs-accent);
  text-shadow: 0 2px 0 rgba(0,0,0,.25);
}

.gs-all-chapters-ui__subtitle{
  margin-top: 10px;
  font-size: 14px;
  color: rgba(255,255,255,.75);
}

/* Grid */
.gs-chapter-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px 28px;
  justify-items: center;
}

/* Card */
.gs-chapter-card{
  text-decoration: none !important;
  color: rgba(255,255,255,0.92) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 8px 10px 12px;
  border-radius: 16px;
}

.gs-chapter-card:hover{
  background: rgba(255,255,255,0.06);
}

/* Bubble */
.gs-chapter-bubble{
  width: 140px;
  height: 140px;
  border-radius: 999px;
  background-image: var(--gs-bubble-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
  position: relative;
}

.gs-chapter-bubble__num{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 46px;
  font-weight: 900;
  color: rgba(255,255,255,.92);
  text-shadow: 0 2px 0 rgba(0,0,0,.25);
  font-family: "Chalkboard SE","Comic Sans MS","Trebuchet MS",system-ui,sans-serif;
}

/* Title */
.gs-chapter-card__title{
  text-align:center;
  font-size: 15px;
  line-height: 1.2;
  max-width: 220px;
  font-weight: 800;
  font-family: "Chalkboard SE","Comic Sans MS","Trebuchet MS",system-ui,sans-serif;
  color: rgba(255,255,255,.85);
}

/* Responsive */
@media (max-width: 900px){
  .gs-chapter-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gs-all-chapters-ui__title{ font-size: 34px; }
}
@media (max-width: 520px){
  .gs-chapter-grid{ grid-template-columns: 1fr; }
  .gs-chapter-bubble{ width: 160px; height: 160px; }
}

/* ===== Progress ring around chapter bubbles ===== */

.gs-chapter-ring{
  position: relative;
  width: 156px;
  height: 156px;
  border-radius: 999px;
  display: grid;
  place-items: center;
}

/* Ring (conic gradient) */
.gs-chapter-ring::before{
  content:"";
  position:absolute;
  inset: 0;
  border-radius: 999px;
  background:
    conic-gradient(var(--gs-accent) calc(var(--p) * 1%), rgba(255,255,255,0.18) 0);
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.22));
}

/* Inner cutout so it looks like a ring */
.gs-chapter-ring::after{
  content:"";
  position:absolute;
  inset: 8px;
  border-radius: 999px;
  background: var(--gs-app-bg);
}

/* Bubble sits above the ring */
.gs-chapter-bubble{
  position: relative;
  z-index: 2;
  width: 140px;
  height: 140px;
}

/* % badge */
.gs-chapter-percent{
  position:absolute;
  z-index: 3;
  bottom: -6px;
  right: -6px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.22);
  color: rgba(255,255,255,0.92);
  font-weight: 900;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  backdrop-filter: blur(6px);
}

/* Completed check */
.gs-chapter-check{
  position:absolute;
  z-index: 4;
  top: -6px;
  right: -6px;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: var(--gs-accent);
  color: #102a2f;
  font-weight: 900;
  box-shadow: 0 10px 18px rgba(0,0,0,.2);
}

/* “Popped” animation for completed chapters */
.gs-chapter-card.is-complete .gs-chapter-ring{
  animation: gsPopRing .35s ease-out;
}

@keyframes gsPopRing{
  0%{ transform: scale(.92); }
  60%{ transform: scale(1.05); }
  100%{ transform: scale(1); }
}

/* ===== Lesson progress ring (Chapter page bubbles) ===== */

.gs-lesson-ring{
  position: relative;
  width: 146px;
  height: 146px;
  border-radius: 999px;
  display: grid;
  place-items: center;
}

/* Ring */
.gs-lesson-ring::before{
  content:"";
  position:absolute;
  inset: 0;
  border-radius: 999px;
  background:
    conic-gradient(var(--gs-accent) calc(var(--p) * 1%), rgba(255,255,255,0.18) 0);
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.22));
}

/* Inner cutout */
.gs-lesson-ring::after{
  content:"";
  position:absolute;
  inset: 8px;
  border-radius: 999px;
  background: var(--gs-app-bg);
}

/* Bubble above ring */
.gs-lesson-ring .gs-bubble{
  position: relative;
  z-index: 2;
  width: 130px;
  height: 130px;
}

/* % badge (optional) */
.gs-lesson-percent{
  position:absolute;
  z-index: 3;
  bottom: -6px;
  right: -6px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.22);
  color: rgba(255,255,255,0.92);
  font-weight: 900;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  backdrop-filter: blur(6px);
}

/* Completed check */
.gs-lesson-check{
  position:absolute;
  z-index: 4;
  top: -6px;
  right: -6px;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: var(--gs-accent);
  color: #102a2f;
  font-weight: 900;
  box-shadow: 0 10px 18px rgba(0,0,0,.2);
}

/* Pop animation when completed */
.gs-bubble-item.is-completed .gs-lesson-ring{
  animation: gsPopRing .35s ease-out;
}

@keyframes gsPopRing{
  0%{ transform: scale(.92); }
  60%{ transform: scale(1.05); }
  100%{ transform: scale(1); }
}

.gs-bubble-item:not(.is-completed) .gs-lesson-percent{
  display: none;
}

/* ===== Dashboard UI ===== */
.gs-dashboard-ui{
  width: 100%;
  min-height: 100vh;
  background: var(--gs-app-bg);
  padding: 40px 20px 70px;
}

.gs-dashboard-header{
  text-align:center;
  margin-bottom: 18px;
}

.gs-dashboard-title{
  margin:0;
  font-weight: 900;
  letter-spacing: .5px;
  font-size: 44px;
  font-family: "Chalkboard SE","Comic Sans MS","Trebuchet MS",system-ui,sans-serif;
  color: var(--gs-accent);
  text-shadow: 0 2px 0 rgba(0,0,0,.25);
}

.gs-dashboard-sub{
  margin-top: 10px;
  font-size: 14px;
  color: rgba(255,255,255,.75);
}

/* Stats */
.gs-dashboard-stats{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  max-width: 980px;
  margin: 0 auto 14px;
}

.gs-stat-card{
  background: var(--gs-card-bg);
  border: 1px solid var(--gs-card-border);
  border-radius: 16px;
  padding: 14px 14px 12px;
  color: rgba(255,255,255,0.92);
  text-align:center;
}

.gs-stat-num{
  font-size: 34px;
  font-weight: 900;
}

.gs-stat-label{
  margin-top: 6px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .85;
}

/* Continue card */
.gs-dashboard-continue{
  max-width: 980px;
  margin: 0 auto 20px;
  padding: 14px 14px 12px;
  border-radius: 16px;
  background: var(--gs-card-bg);
  border: 1px solid var(--gs-card-border);
  color: rgba(255,255,255,0.92);
  display:grid;
  gap: 10px;
}

.gs-dashboard-btn{
  text-decoration:none !important;
  background: var(--gs-accent);
  color: #102a2f !important;
  font-weight: 900;
  padding: 10px 16px;
  border-radius: 999px;
  box-shadow: 0 10px 18px rgba(0,0,0,.2);
  justify-self: end;
}

.gs-dashboard-btn--ghost{
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.92) !important;
  box-shadow: none;
}

.gs-dashboard-bar{
  height: 10px;
  border-radius: 999px;
  background: var(--gs-bar-bg);
  overflow:hidden;
}

.gs-dashboard-fill{
  height: 100%;
  border-radius: 999px;
  background: var(--gs-accent);
}

.gs-dashboard-meta{
  font-size: 12px;
  font-weight: 800;
  opacity: .85;
}

/* Section title */
.gs-dashboard-section-title{
  max-width: 980px;
  margin: 10px auto 12px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
}

/* Reuse your existing .gs-chapter-grid + ring styles */
@media (max-width: 900px){
  .gs-dashboard-title{ font-size: 34px; }
  .gs-dashboard-stats{ grid-template-columns: 1fr; }
}

html, body{
  height: 100%;
}

body{
  background: var(--gs-app-bg) !important;
}

/* Make Elementor canvas pages not add random spacing */
.elementor-page,
.elementor-page #content,
.elementor-page .site-content{
  background: transparent !important;
}

/* Topbar */
.gs-topbar{
  max-width: 980px;
  margin: 0 auto 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}

.gs-topbar-back{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  text-decoration:none !important;
  color: rgba(255,255,255,0.92) !important;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.18);
  font-weight: 900;
  font-size: 20px;
}

.gs-topbar-title{
  flex: 1;
  text-align: center;
  font-weight: 900;
  color: rgba(255,255,255,0.92);
  font-size: 16px;
  letter-spacing: .02em;
}

.gs-topbar-spacer{
  width: 44px;
}

/* Mobile tweaks */
@media (max-width: 520px){
  .gs-all-chapters-ui,
  .gs-dashboard-ui,
  .gs-chapter-ui{
    padding: 22px 14px 70px !important;
  }

  .gs-chapter-grid{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 18px 16px !important;
  }

  /* Slightly smaller rings */
  .gs-chapter-ring{
    width: 142px !important;
    height: 142px !important;
  }
  .gs-chapter-bubble{
    width: 128px !important;
    height: 128px !important;
  }

  .gs-lesson-ring{
    width: 138px !important;
    height: 138px !important;
  }
  .gs-lesson-ring .gs-bubble{
    width: 124px !important;
    height: 124px !important;
  }
}/* End custom CSS */