:root {
  --woolearn-color-primary: #ff9100;
}

.woolearn-steps-form .steps {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
}
.woolearn-steps-form .step-navs {
  border-top: #ddd 1px dashed;
  padding-top: 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.woolearn-container {
  width: 1390px;
  max-width: 100%;
  margin: auto;
}

.woolearn-headlines {
  list-style: none;
  padding: 0;
  margin: 0;
}
.woolearn-headlines .headline-item {
  padding: 2rem;
  background: #fff;
  border: #eee 1px solid;
}
.woolearn-headlines .headline-item:not(:last-of-type) {
  margin-bottom: 1rem;
}
.woolearn-headlines .headline-item .item-header {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.woolearn-headlines .headline-item .item-header .title {
  flex: 1;
}
.woolearn-headlines .headline-item .item-header .title a {
  text-decoration: none;
}
.woolearn-headlines .headline-item .item-header .item-toggle_button .hide-label {
  display: none;
}
.woolearn-headlines .headline-item .item-footer {
  margin-top: 1rem;
  padding-top: 0.5rem;
  border-top: #eee 1px solid;
  display: none;
}
.woolearn-headlines .headline-item .item-footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.woolearn-headlines .headline-item .item-footer ul li a {
  display: flex;
  align-items: center;
  padding: 0.5rem 0;
  gap: 0.5rem;
  text-decoration: none;
}
.woolearn-headlines .headline-item .item-footer ul li a .title {
  flex: 1;
}
.woolearn-headlines .headline-item .item-footer ul li:not(:last-of-type) {
  border-bottom: #eee 1px solid;
}
.woolearn-headlines .headline-item--showing .item-header .item-toggle_button .hide-label {
  display: block;
}
.woolearn-headlines .headline-item--showing .item-header .item-toggle_button .show-label {
  display: none;
}

.product-lessons-page, .product-lessons-page * {
  box-sizing: border-box;
}
.product-lessons-page .woolearn-container {
  display: flex;
  flex-wrap: wrap;
}
.product-lessons-page .woolearn-container .lessons-title {
  min-width: 100%;
  max-width: 100%;
  border-bottom: #eee 1px solid;
  padding: 2rem 0;
  margin: 0;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  white-space: nowrap;
  overflow: auto;
}
.product-lessons-page .woolearn-container .lessons-title i {
  font-size: 1rem;
}
@media screen and (max-width: 768px) {
  .product-lessons-page .woolearn-container .lessons-title {
    font-size: 0.874rem;
  }
  .product-lessons-page .woolearn-container .lessons-title i {
    font-size: 0.874rem;
  }
}
.product-lessons-page .woolearn-container .lessons-sidebar {
  min-width: 25%;
  max-width: 25%;
  border-left: #eee 1px solid;
  padding-left: 1rem;
  box-sizing: border-box;
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines {
  list-style: none;
  padding: 0;
  margin: 0;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item .title a {
  text-decoration: none;
  display: block;
  padding: 0.5rem 0;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item .item-lessons {
  display: none;
  list-style: none;
  padding: 0 1rem 0 0;
  margin: 0;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item--active > .title a {
  color: var(--woolearn-color-primary);
  font-size: 1.5rem;
  font-weight: 500;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item--active .item-lessons {
  display: block;
  margin: 1rem 0;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item--active .item-lessons .lesson-item {
  margin-bottom: 0.5rem;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item--active .item-lessons .lesson-item a {
  display: flex;
  text-decoration: none;
  gap: 0.5rem;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item--active .item-lessons .lesson-item a .title {
  flex: 1;
}
.product-lessons-page .woolearn-container .lessons-sidebar .sidebar-headlines .headline-item--active .item-lessons .lesson-item--active a {
  color: var(--woolearn-color-primary);
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .product-lessons-page .woolearn-container .lessons-sidebar {
    min-width: 100%;
    max-width: 100%;
    border-left: none;
    border-top: #eee 1px solid;
    order: 2;
  }
}
.product-lessons-page .woolearn-container .lessons-content {
  min-width: 75%;
  max-width: 75%;
  padding: 2rem;
}
.product-lessons-page .woolearn-container .lessons-content .entry-title {
  padding: 0;
  margin: 0 0 2rem 0;
  font-size: 2.5rem;
}
.product-lessons-page .woolearn-container .lessons-content .entry-content {
  margin-bottom: 2rem;
}
.product-lessons-page .woolearn-container .lessons-content .entry-description {
  border-top: #eee 1px solid;
  padding-top: 1rem;
  font-size: 1rem;
}
.product-lessons-page .woolearn-container .lessons-content .edit-lesson {
  margin-top: 2rem;
}
@media screen and (max-width: 768px) {
  .product-lessons-page .woolearn-container .lessons-content {
    min-width: 100%;
    max-width: 100%;
    padding: 1rem;
  }
  .product-lessons-page .woolearn-container .lessons-content .entry-title {
    font-size: 1.5rem;
  }
  .product-lessons-page .woolearn-container .lessons-content .entry-description {
    font-size: 0.874rem;
  }
}

.woolearn-pdf-viewer {
  position: relative;
  width: 100%;
}
.woolearn-pdf-viewer .pdf-viewer-scene {
  width: 100%;
  height: 700px;
  border: #eee 1px solid;
  margin-bottom: 1rem;
}

.woolearn-messages, .woolearn-notice {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 2rem;
  background: #f5f5f5;
  color: #333;
  gap: 1rem;
  font-size: 1rem;
}
.woolearn-messages--error, .woolearn-notice--error {
  background: rgba(255, 0, 0, 0.15);
  color: red;
}
.woolearn-messages--success, .woolearn-notice--success {
  background: rgba(0, 255, 0, 0.15);
  color: green;
}
.woolearn-messages--warning, .woolearn-notice--warning {
  background: rgba(255, 115, 0, 0.1);
  color: #e69400;
}
.woolearn-messages .button, .woolearn-notice .button {
  margin-top: 0 !important;
}

ul.woolearn-messages {
  display: block;
  list-style: inside;
}

.lessons-edit-form .edit-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}
.lessons-edit-form .lesson-thumbnail {
  position: relative;
  width: 500px;
  max-width: 100%;
  margin: auto;
  margin-bottom: 2rem;
  overflow: hidden;
}
.lessons-edit-form .lesson-thumbnail .thumbnail-placeholder {
  padding-top: 70%;
  background-color: #eee;
  border-radius: 10px;
  z-index: 0;
}
.lessons-edit-form .lesson-thumbnail img {
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  z-index: 1;
}
.lessons-edit-form .lesson-thumbnail .thumbnail-actions {
  transition: 0.2s;
}
.lessons-edit-form .lesson-thumbnail .thumbnail-actions button {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
  background: transparent;
  font-size: 1.5rem;
  z-index: 2;
}
.lessons-edit-form .lesson-thumbnail .thumbnail-actions .add {
  display: block;
}
.lessons-edit-form .lesson-thumbnail .thumbnail-actions .remove {
  display: none;
}
.lessons-edit-form .lesson-thumbnail.selected-item .thumbnail-actions .add {
  display: none;
}
.lessons-edit-form .lesson-thumbnail.selected-item .thumbnail-actions .remove {
  display: block;
}
.lessons-edit-form .lesson-thumbnail:not(:hover) .thumbnail-actions {
  opacity: 0;
}
.lessons-edit-form .lesson-title {
  margin-bottom: 2rem;
}
.lessons-edit-form .input-area input {
  width: 100%;
}
.lessons-edit-form .form-header {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin-bottom: 2rem;
}
.lessons-edit-form .form-header .header-section {
  min-width: 300px;
  flex: 1;
}
.lessons-edit-form .form-messages {
  margin-bottom: 2rem;
}
.lessons-edit-form .lesson-additional-settings {
  margin-bottom: 2rem;
}