.elementor-1649 .elementor-element.elementor-element-8e74675{--display:flex;}.elementor-widget-theme-page-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1649 .elementor-element.elementor-element-23316ee .elementor-heading-title{font-family:"Lato", Sans-serif;font-size:50px;font-weight:600;color:var( --e-global-color-6078292 );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-1649 .elementor-element.elementor-element-fd81326{font-family:"Lato", Sans-serif;font-size:22px;font-weight:400;color:var( --e-global-color-accent );}.elementor-1649 .elementor-element.elementor-element-f052da3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1649 .elementor-element.elementor-element-2430337{--display:flex;}.elementor-1649 .elementor-element.elementor-element-d92cacc{--display:flex;}/* Start custom CSS for html, class: .elementor-element-30b8fe1 */.chapter-progress-wrapper {
  margin-bottom: 20px;
}

.chapter-progress-text {
  font-size: 14px;
  margin-bottom: 6px;
  font-weight: 600;
  color: #630320;
}

.chapter-progress {
  width: 100%;
  height: 10px;
  background: #eee;
  border-radius: 20px;
}

.chapter-progress-bar {
  height: 100%;
  width: 0%;
  background: #630320;
  border-radius: 20px;
  transition: width 0.4s ease;
  
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-eb14bd2 */.part {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-bottom: 12px;
  transition: all 0.3s ease;
  background: #fff;
}

.part.open {
  box-shadow: 0 4px 12px rgba(99, 3, 32, 0.1);
}

.part-header {
  padding: 14px;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  color: #4b0d1c;
  font-family: Lato, sans-serif;
  font-size: 20px;
  font-weight: bold;
  transition: background 0.3s ease, color 0.3s ease;
}

.part-header:hover {
  background: linear-gradient(90deg, #f9ecec, #f0c0c0);
  color: #33010f;
}
.part-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease, padding 0.5s ease;
  padding: 0 14px; /* no vertical padding initially */
  color: #4b0d1c;
}

.part-content.open-content {
  padding: 12px 14px; /* add padding when expanded */
}

.part-content h3 {
  margin-top: 12px;
  color: #630320;
}

.part-content p, .part-content ul {
  margin: 8px 0 12px 0;
  line-height: 1.6;
}

.part-content ul li {
  margin-bottom: 6px;
}

.status {
  font-size: 14px;
  transition: color 0.3s ease;
}

.not-started {
  color: #777;
}

.in-progress {
  color: #f39c12;
}

.completed-status {
  color: #2ecc71;
  font-weight: bold;
}

.locked {
  opacity: 0.6;
}

.locked .part-header {
  cursor: not-allowed;
}

.locked-status {
  color: #999;
}

/* Custom Checkbox Container */
.custom-checkbox {
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: 18px;
  margin-top: 12px;
  user-select: none;
  position: relative;
  padding-left: 35px; /* space for the checkbox */
  color: #4b0d1c;
  transition: color 0.3s ease;
}

/* Hide default checkbox */
.custom-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create custom checkmark */
.custom-checkbox .checkmark {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 24px;
  width: 24px;
  background-color: #fff;
  border: 2px solid #4b0d1c;
  border-radius: 6px;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Create checkmark symbol (hidden by default) */
.custom-checkbox .checkmark::after {
  content: "";
  position: absolute;
  display: none;
  width: 8px;
  height: 14px;
  border: solid white;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

/* On hover, change border and background slightly */
.custom-checkbox:hover .checkmark {
  border-color: #f39c12;
  box-shadow: 0 0 5px rgba(243, 156, 18, 0.5);
}

/* When checked */
.custom-checkbox input:checked ~ .checkmark {
  background-color: #2ecc71;
  border-color: #2ecc71;
  animation: pop 0.3s ease;
}

/* Show the checkmark */
.custom-checkbox input:checked ~ .checkmark::after {
  display: block;
}

/* Pop animation for checked state */
@keyframes pop {
  0% { transform: translateY(-50%) scale(0.8); }
  50% { transform: translateY(-50%) scale(1.2); }
  100% { transform: translateY(-50%) scale(1); }
}/* End custom CSS */