/* =expandable-lesson block
*/
.block-expandable-lesson {
  color: var(--wp--preset--color--background);
  width: 100%;
  max-width: 100%;
  margin-top: var(--wp--custom--layout--padding);
  margin-bottom: var(--wp--custom--layout--padding);
  text-align: left;
  transition: 1s all ease-in-out;
}

.block-expandable-lesson .ld-item-list-item-header {
  grid-row-gap: 12px !important;
}

.learndash-wrapper .block-expandable-lesson.ld-item-list {
  margin: var(--wp--custom--layout--padding) 0;
}
.learndash-wrapper .block-expandable-lesson.ld-item-list .ld-item-list-item {
  border-radius: 0;
  border: none;
}

.block-expandable-lesson a {
  text-decoration: none;
}
.block-expandable-lesson .list-item__heading {
  position: relative;
  margin: 0;
  font-weight: 500;
  padding: 0 var(--wp--custom--layout--padding) 12px;
  font-family: var(--wp--preset--font-family--primary);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.block-expandable-lesson .ld-item-subtitle {
  color: var(--wp--preset--color--background);
}

/*Expand/Collapse*/
.block-expandable-lesson .ld-item-expand::after {
  content: '+';
  font-weight: bold;
  font-family: var(--wp--preset--font-family--system-font);
  color: var(--wp--preset--color--background);
  display: inline-block;
  font-weight: 300;
  font-size: 30px;
}
.block-expandable-lesson.is-open .ld-item-expand::after {
  content: '-';
}
.block-expandable-lesson .ld-item-expand {
  grid-area: 1/2/2/3;
  justify-self: flex-end;
  align-self: start;
  position: relative;
  z-index: 1000;
  height: 30px;
  width: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}




.wp-admin .block-expandable-lesson .list-item__content__hidden {
  display: block;
}

/*Not Opened Styles*/
.block-expandable-lesson:not(.is-open) .ld-item-list-item-footer,
.block-expandable-lesson:not(.is-open) .ld-item-excerpt {
  display: none !important;
}
.block-expandable-lesson:not(.is-open) .ld-item-list-item-header {
  display: grid;
  grid-template-columns: 1fr 60px !important;
  grid-template-rows: 30px 1fr !important;
  grid-column-gap: 24px !important;
  grid-row-gap: 12px !important;
}
.block-expandable-lesson:not(.is-open) .ld-item-list-item-header .ld-item-name .ld-item-title {
  font-size: var(--wp--preset--font-size--big);
}


@media (min-width: 993px) {
  .block-expandable-lesson:not(.is-open) .ld-item-list-item-header {
    grid-template-columns: 120px 1fr 60px !important;
    grid-template-rows: auto 1fr !important;
    grid-row-gap: 0px !important;
    align-content: center !important;
  }
  .block-expandable-lesson:not(.is-open) .ld-item-lesson-item {
    padding-top: var(--wp--custom--layout--block-gap-large);
    padding-bottom: var(--wp--custom--layout--block-gap-large);
  }
  .block-expandable-lesson:not(.is-open) .ld-item-list-item-header .ld-item-subtitle {
    grid-area: 1 / 1 / 2 / 2 !important;
    align-self: center;
  }
  .block-expandable-lesson:not(.is-open) .ld-item-list-item-header .ld-item-name {
    grid-area: 1 / 2 / 2 / 3 !important;
    align-self: center;
  }
  .block-expandable-lesson:not(.is-open) .ld-item-expand {
    grid-area: 1 / 3 / 2 / 4 !important;
    align-self: center;
  }

}
@media (max-width: 993px) {
  .block-expandable-lesson.is-open .ld-item-list-item-header {
    display: grid;
    grid-template-columns: 1fr 60px !important;
    grid-template-rows: 30px 1fr auto !important;
    grid-row-gap: 12px !important;
  }
  .block-expandable-lesson.is-open .ld-item-list-item-header .ld-item-name {
    grid-area: 2 / 1 / 3 / 4;
  }
  .block-expandable-lesson.is-open .ld-item-list-item-header .ld-item-excerpt {
    grid-area: 3 / 1 / 4 / 4;
  }
  .block-expandable-lesson:not(.is-open) .ld-item-list-item-header .ld-item-subtitle {
    grid-area: 1/1/3/3;
  }
  .block-expandable-lesson:not(.is-open) .ld-item-list-item-header .ld-item-name {
    grid-area: 2/1/3/3;
  }
  .block-expandable-lesson:not(.is-open) .ld-item-list-item-header .ld-item-excerpt {
    grid-area: 2/1/3/3;
  }
  .block-expandable-lesson:not(.is-open) .ld-item-expand {
    grid-area: 1/2/3/3;
  }

}