/**
 * These breakpoints' pixels are used in the legacy
 * breakpoint mixin only.
 *
 * The container-breakpoint mixin breakpoints are defined in the
 * LearnDash\Core\Template\Breakpoints PHP class.
 *
 * The names of the breakpoints are used in both mixins.
 * Please keep those synced.
 */
/**
 * This is the required way to use breakpoints in the project.
 *
 * @param {String}              $name - The name of the breakpoint.
 * @param {Boolean|String|List} $container - If true, the breakpoint class will
 *                                  be applied directly to the current element.
 *                                  If a string (or list) is provided, the
 *                                  breakpoint class will be applied directly
 *                                  to the provided container with the current
 *                                  element as a child selector. If false, the
 *                                  breakpoint class will be applied as an
 *                                  ancestor of the current element.
 */
/**
 * This is the legacy way to use breakpoints in the project.
 * Don't use it unless you have a very good reason,
 * you have to provide it in the PR.
 *
 * @param {String} $name - The name of the breakpoint.
 * @param {String} $type - The type of the breakpoint.
 *                         Can be 'min' or 'max'.
 */
:root {
  /** Colors **/
  --ld-color-semantic-success: #2f8351;
  --ld-color-semantic-error: #db0000;
  --ld-color-system-body-text: #333;
  --ld-color-system-middle-gray: #d2d7e2;
  --ld-color-system-middle-gray-light: #edf0f5;
  --ld-color-system-light-2: #f6f8fa;
  --ld-color-system-subtle: #73738c;
  --ld-color-system-subtle-text: var(--ld-color-system-subtle);
  /** Forms **/
  --ld-color-field-bg: var(--ld-color-system-white);
  --ld-color-field-border: var(#8694B1);
  --ld-color-field-border-error: var(--ld-color-semantic-error);
  --ld-color-field-border-valid: var(--ld-color-semantic-success);
  --ld-color-field-error: var(--ld-color-semantic-error);
}

:root {
  /** Colors **/
  --ld-color-brand-primary: #235af3;
  --ld-color-brand-secondary: #f3b33e;
  --ld-color-brand-tertiary: #479bf8;
  --ld-color-semantic-success: #3eab6a;
  --ld-color-semantic-error: #e65255;
  --ld-color-system-dark: #1439c4;
  --ld-color-system-body-text: #4a4a68;
  --ld-color-system-subtle: #8c8ca2;
  --ld-color-system-subtle-text: var(--ld-color-system-subtle);
  --ld-color-system-border: #dce1e8;
  --ld-color-system-light-1: #f3f8ff;
  --ld-color-system-light-2: #f7f9fc;
  --ld-color-system-white: #fff;
  /** Alerts **/
  --ld-color-alert-bg: #7a7a7a;
  --ld-color-alert-text: var(--ld-color-system-white);
  /** Site body **/
  --ld-color-body-bg: var(--ld-color-system-white);
  /** TODO: Where should it go? **/
  --ld-color-border: #ddd;
  /** Buttons **/
  --ld-color-button: var(--ld-color-system-white);
  --ld-color-button-bg: var(--ld-color-brand-primary);
  --ld-color-button-bg-hover: #2c4fd1;
  /** Progress bar **/
  --ld-color-progress-bar-bg: #f5f5f5;
  --ld-color-progress-bar-fg: #000;
  /** Forms **/
  --ld-color-field-bg: var(--ld-color-system-light-1);
  --ld-color-field-bg-hover: var(--ld-color-system-white);
  --ld-color-field-bg-active: var(--ld-color-system-white);
  --ld-color-field-bg-valid: var(--ld-color-system-white);
  --ld-color-field-bg-error: var(--ld-color-system-white);
  --ld-color-field-bg-disabled: var(--ld-color-system-light-2);
  --ld-color-field-border: var(--ld-color-system-subtle);
  --ld-color-field-border-active: var(--ld-color-brand-primary);
  --ld-color-field-border-active-shadow: 0 0 0 4px rgba(50, 89, 235, 0.2);
  --ld-color-field-border-error: var(--ld-color-semantic-error);
  --ld-color-field-border-error-shadow: 0 0 0 4px rgba(230, 82, 85, 0.2);
  --ld-color-field-border-valid: var(--ld-color-semantic-success);
  --ld-color-field-border-valid-shadow: 0 0 0 4px rgba(62, 171, 106, 0.2);
  --ld-color-field-border-disabled: var(--ld-color-system-light-3);
  --ld-color-field-text: var(--ld-color-system-subtle-text);
  --ld-color-field-text-active: var(--ld-color-system-dark);
  --ld-color-field-text-valid: var(--ld-color-system-dark);
  --ld-color-field-text-error: var(--ld-color-system-dark);
  --ld-color-field-text-disabled: var(--ld-color-system-subtle-text);
  --ld-color-field-description: var(--ld-color-system-subtle-text);
  --ld-color-field-error: var(--ld-color-semantic-error);
  --ld-color-label: var(--ld-color-system-dark);
  --ld-color-button-secondary-border: #728188;
}

.ld-layout {
  display: grid;
  grid-gap: var(--ld-spacer-fixed-6);
  grid-template-areas: "header" "sidebar" "content";
  grid-template-columns: 1fr;
  /**
   * Positions any injected children from a hook to display
   * after the content grid-area.
   *
   * This checks specifically whether the element is not the header,
   * sidebar, or content elements and that they're not a script or style tag.
   *
   * Checking for script and style tags is important as otherwise
   * they'll be rendered as text!
   *
   * It is possible that 3rd parties may need to make CSS adjustments for this
   * to work well with their injected content, but this should cover most cases.
   */
}
.ld-layout,
.ld-layout * {
  -webkit-font-smoothing: antialiased;
}
.ld-layout--no-header {
  grid-template-areas: "sidebar" "content";
}
.ld-layout.ld-breakpoint--extra-small:not(.ld-layout--no-sidebar) {
  grid-template-areas: "header header" "content sidebar";
  grid-template-columns: auto clamp(210px, 30.5%, 285px);
}
.ld-layout.ld-breakpoint--extra-small:not(.ld-layout--no-sidebar).ld-layout--no-header {
  grid-template-areas: "content sidebar";
}
.ld-layout--no-sidebar {
  grid-template-areas: "header" "content";
}
.ld-layout--no-sidebar.ld-layout--no-header {
  grid-template-areas: "content";
}
.ld-layout__header, .ld-layout__sidebar, .ld-layout__content {
  display: grid;
}
.ld-layout__header {
  grid-area: header;
}
.ld-layout__sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-4);
  grid-area: sidebar;
  margin-top: var(--ld-spacer-2);
}
.ld-layout__content {
  grid-area: content;
  gap: var(--ld-spacer-2);
}
.ld-layout > *:not(.ld-layout__header):not(.ld-layout__sidebar):not(.ld-layout__content):not(script):not(style) {
  display: flex;
  flex-direction: column;
  grid-column: 1/2;
  grid-row-start: span 1;
}
.ld-layout--no-sidebar .ld-layout > *:not(.ld-layout__header):not(.ld-layout__sidebar):not(.ld-layout__content):not(script):not(style) {
  grid-column: 1/-1;
}

.ld-form .ld-form__field {
  background: var(--ld-color-field-bg);
  border: 1px solid var(--ld-color-field-border);
  border-radius: var(--ld-radius);
  box-sizing: border-box;
  color: var(--ld-color-field-text);
  display: inline-block;
  font-family: var(--ld-typography-font-family);
  font-size: var(--ld-typography-desktop-body-size);
  font-weight: var(--ld-typography-font-weight-regular);
  height: auto;
  line-height: var(--ld-typography-desktop-body-height);
  margin-bottom: var(--ld-spacer-4);
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-3);
}
.ld-form .ld-form__field:active, .ld-form .ld-form__field:focus {
  border-color: var(--ld-color-field-border-active);
  box-shadow: inset 0 0 0 2px var(--ld-color-field-border-active);
  outline: 0;
}
.ld-form .ld-form__field:disabled {
  background: var(--ld-color-field-bg-disabled);
  border-color: var(--ld-color-field-border-disabled);
  color: var(--ld-color-field-text-disabled);
}
.ld-form .ld-form__field:hover {
  background: var(--ld-color-field-bg-hover);
}
.ld-form .ld-form__field--error:not(:focus) {
  border-color: var(--ld-color-field-border-error);
}
.ld-form .ld-form__field--valid {
  border-color: var(--ld-color-field-border-valid);
}
.ld-form .ld-form__field-wrapper--type-radio {
  cursor: pointer;
  position: relative;
}
.ld-form .ld-form__field-wrapper--type-radio input[type=radio] {
  position: absolute;
  height: 1.5em;
  left: -5px;
  opacity: 0;
  top: -2px;
  width: 1.5em;
}
.ld-form .ld-form__field-wrapper--type-radio input[type=radio]:checked + .ld-svgicon__radio .ld-svgicon__radio-select {
  display: inline-block;
}
.ld-form .ld-form__field-wrapper--type-radio input[type=radio]:not(:checked) + .ld-svgicon__radio .ld-svgicon__radio-select {
  display: none;
}
.ld-form input[type=checkbox] {
  border-color: var(--ld-color-field-border);
  border-radius: var(--ld-radius);
  border-width: 1px;
  cursor: pointer;
  margin-right: var(--ld-spacer-1);
  transform: scale(1.5);
  transform-origin: left;
  vertical-align: baseline;
}
.ld-form input[type=checkbox]:after {
  content: "";
  opacity: 0;
  display: block;
  left: 8px;
  top: 4px;
  position: absolute;
  width: 7px;
  height: 13px;
  border: 3px solid var(--form--color-text);
  border-top: 0;
  border-left: 0;
  transform: rotate(30deg);
}
.ld-form input[type=checkbox]:checked:after {
  opacity: 1;
}
.ld-form__fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

.ld-form__field-error-message {
  color: var(--ld-color-semantic-error);
  display: block;
  font-size: var(--ld-typography-desktop-body-small-size);
  line-height: var(--ld-typography-desktop-body-small-height);
  margin-bottom: var(--ld-spacer-4);
  margin-top: calc(-1 * var(--ld-spacer-1));
}
.ld-form__field-password-wrapper + .ld-form__field-error-message {
  margin-bottom: var(--ld-spacer-1);
  margin-top: var(--ld-spacer-1);
}
.ld-form__field-confirm_password-wrapper + .ld-form__field-error-message {
  margin-bottom: 0;
}

.ld-button {
  align-items: center;
  border-radius: var(--ld-button-border-radius);
  border-style: none;
  box-sizing: border-box;
  color: var(--ld-color-system-white);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--ld-typography-font-family);
  font-size: var(--ld-typography-desktop-button-text-size);
  font-weight: var(--ld-typography-desktop-button-text-weight);
  justify-content: center;
  letter-spacing: var(--ld-typography-desktop-button-text-spacing);
  line-height: var(--ld-typography-desktop-button-text-height);
  overflow-wrap: break-word;
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-5);
  text-align: center;
  text-decoration: none;
  white-space: normal;
  width: auto;
  word-break: normal;
}
.ld-button--lg {
  height: 56px;
  padding: var(--ld-spacer-3) var(--ld-spacer-fixed-5);
}
.ld-button--sm {
  font-size: var(--ld-typography-mobile-button-text-size);
  height: 46px;
  line-height: var(--ld-typography-mobile-button-text-height);
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-4);
}
.ld-button--primary {
  background-color: var(--ld-color-button-bg);
}
.ld-button--primary:active, .ld-button--primary:hover {
  background-color: var(--ld-color-button-bg-hover);
}
.ld-button--secondary {
  background-color: #fff;
  border: 2px solid var(--ld-color-button-secondary-border);
  color: var(--ld-color-system-body-text);
}
.ld-button--secondary:active, .ld-button--secondary:focus, .ld-button--secondary:hover {
  background-color: var(--ld-color-system-light-1);
  color: var(--ld-color-system-body-text);
  outline: none;
}
.ld-button--tertiary {
  background-color: transparent;
  border: 3px solid var(--ld-color-brand-primary);
  color: var(--ld-color-brand-primary);
}
.ld-button--tertiary:active, .ld-button--tertiary:hover {
  background-color: transparent;
  color: var(--ld-color-button-bg-hover);
}
.ld-button--rounded {
  border-radius: var(--ld-button-border-radius-rounded);
}
.ld-button--border {
  background: var(--ld-color-field-bg);
  border: 2px solid var(--ld-color-field-border);
  border-radius: 8px;
  color: var(--ld-color-system-body-text);
  font-family: var(--ld-typography-font-family);
  font-size: var(--ld-typography-desktop-body-size);
  font-weight: var(--ld-typography-font-weight-medium);
  line-height: var(--ld-typography-desktop-body-height);
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-3);
}
.ld-button--border:focus {
  border-color: var(--ld-color-system-body-text);
  box-shadow: inset 0 0 0 2px var(--ld-color-system-body-text);
  outline: none;
}
.ld-button--border:active, .ld-button--border:hover {
  background-color: var(--ld-color-system-light-1);
  border-color: var(--ld-color-system-body-text);
  color: var(--ld-color-system-body-text);
  outline: none;
}
.ld-button:disabled {
  background-color: var(--ld-color-system-light-2);
  border: 1px solid var(--ld-color-system-border);
  color: var(--ld-color-system-subtle-text);
  cursor: not-allowed;
}
.ld-button__password-visibility-toggle {
  background-color: var(--ld-color-field-bg);
}

.ld-form input[type=button]:disabled,
.ld-form input[type=submit]:disabled,
.ld-form input[type=reset]:disabled,
.ld-form button:disabled,
.ld-form .ld-button:disabled {
  cursor: not-allowed;
}

.ld-tab-bar {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-1);
}
.ld-tab-bar.ld-breakpoint--small {
  gap: var(--ld-spacer-3);
}
.ld-tab-bar--single.ld-tab-bar--no-access {
  margin-top: var(--ld-spacer-2);
}
.ld-tab-bar__tabs {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
}
.ld-breakpoint--small .ld-tab-bar__tabs {
  gap: var(--ld-spacer-fixed-0);
}
.ld-tab-bar__tab {
  all: unset;
  align-items: center;
  color: var(--ld-color-system-body-text);
  cursor: pointer;
  display: flex;
  flex-direction: row;
  font-weight: var(--ld-typography-font-weight-bold);
  gap: var(--ld-spacer-fixed-1);
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-0) var(--ld-spacer-1) var(--ld-spacer-fixed-0);
  position: relative;
  /**
   * Hover styles come first as Hovering over an active item
   * should keep the active styles.
   */
}
.ld-breakpoint--small .ld-tab-bar__tab {
  padding: var(--ld-spacer-1) var(--ld-spacer-fixed-1) var(--ld-spacer-2) var(--ld-spacer-fixed-0);
}
.ld-tab-bar__tab::before {
  border-bottom: 0.125rem solid var(--ld-color-system-middle-gray);
  bottom: 0.125rem;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  width: 100vw;
}
.ld-tab-bar__tab::after {
  border-bottom: 0.25rem solid transparent;
  bottom: 0.125rem;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
}
.ld-tab-bar__tab .ld-svgicon {
  color: var(--ld-color-system-subtle-text);
}
.ld-tab-bar__tab:hover, .ld-tab-bar__tab:focus, .ld-tab-bar__tab:focus-visible, .ld-tab-bar__tab[aria-selected=true] {
  box-shadow: none;
}
.ld-tab-bar__tab:hover .ld-svgicon, .ld-tab-bar__tab:focus .ld-svgicon, .ld-tab-bar__tab:focus-visible .ld-svgicon, .ld-tab-bar__tab[aria-selected=true] .ld-svgicon {
  color: inherit;
}
.ld-tab-bar__tab:hover {
  background-color: unset;
  color: var(--ld-color-system-dark);
}
.ld-tab-bar__tab:hover::after {
  border-color: var(--ld-color-system-dark);
}
.ld-tab-bar__tab[aria-selected=true] {
  background-color: unset;
  color: var(--ld-color-brand-primary);
}
.ld-tab-bar__tab[aria-selected=true]::after {
  border-color: var(--ld-color-brand-primary);
}
.ld-tab-bar__tab:focus, .ld-tab-bar__tab:focus-visible {
  background: var(--ld-color-system-dark);
  color: var(--ld-color-system-white);
}
.ld-tab-bar__tab:focus::after, .ld-tab-bar__tab:focus-visible::after {
  display: none;
}
.ld-tab-bar__panel > p {
  margin-bottom: var(--ld-spacer-3);
}
.ld-tab-bar__panel > * {
  margin-top: 0;
}
.ld-tab-bar__panel .ld-featured-image {
  height: auto;
  margin-bottom: var(--ld-spacer-8);
  width: 100%;
}

.ld-registration__wrapper {
  margin: auto;
}
.ld-registration__wrapper.ld-breakpoint--medium {
  display: flex;
  flex-wrap: wrap;
}
.ld-registration__wrapper--logged-in.ld-registration__wrapper.ld-breakpoint--medium {
  display: block;
  flex-wrap: wrap;
}
.ld-registration__wrapper--logged-in.ld-registration__wrapper.ld-breakpoint--medium .ld-registration-order {
  border-top: none;
  box-sizing: border-box;
  flex: 0 0 100%;
  margin-bottom: 0;
  max-width: 650px;
  padding-left: 0;
  padding-right: 0;
}
.ld-registration__wrapper--logged-in.ld-registration__wrapper .ld-registration-order {
  max-width: 650px;
}
.ld-registration__wrapper--logged-in.ld-registration__wrapper .ld-registration-order__return {
  font-size: inherit;
}
.ld-registration__wrapper--logged-in.ld-registration__wrapper .ld-registration-order__return .dashicons {
  font-size: inherit;
}
.ld-registration__wrapper--logged-in.ld-registration__wrapper .ld-registration-order__return-wrapper {
  border-right: none;
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
  padding-right: 0;
}
.ld-registration__wrapper--logged-in.ld-registration__wrapper .ld-registration__form {
  border-right: none;
  flex: 0 0 100%;
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
  padding-right: 0;
}
.ld-registration__wrapper--login .ld-registration__login,
.ld-registration__wrapper--login .ld-registration__login-form {
  display: block;
}
.ld-registration__wrapper--login .ld-registration__register,
.ld-registration__wrapper--login .ld-registration__register-form {
  display: none;
}
.ld-registration__wrapper--register .ld-registration__login,
.ld-registration__wrapper--register .ld-registration__login-form {
  display: none;
}
.ld-registration__wrapper--register .ld-registration__register,
.ld-registration__wrapper--register .ld-registration__register-form {
  display: block;
}
.ld-registration__wrapper .ld-alert {
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
}
.ld-registration__wrapper--has-order.ld-breakpoint--medium .ld-registration__form {
  border-right: 1px solid var(--ld-color-system-middle-gray);
  box-sizing: border-box;
  flex: 0 0 67%;
  margin-left: 0;
  margin-right: 0;
  max-width: 67%;
  padding-right: var(--ld-spacer-9);
}
.ld-registration__login, .ld-registration__register {
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
}
.ld-registration__login, .ld-registration__login-form {
  display: none;
}
.ld-registration__register, .ld-registration__register-form {
  display: block;
}
.ld-registration__register-form .ld-password-strength__error {
  display: none;
}
.ld-registration__register, .ld-registration__login {
  margin-bottom: var(--ld-spacer-5);
}
.ld-registration__heading {
  margin-bottom: var(--ld-spacer-5);
}
.ld-registration__p {
  margin-bottom: var(--ld-spacer-5);
}
.ld-registration__register .ld-registration__p:last-child {
  margin-bottom: 0;
}
.ld-registration__login-button {
  display: inline-block;
}
.ld-registration__login-button--active {
  display: none;
}
.ld-registration__form {
  padding-bottom: var(--ld-spacer-6);
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
  width: 100%;
}
.ld-registration__form .ld-password-strength {
  margin-bottom: var(--ld-spacer-fixed-1);
}
.ld-registration__login-form input:not([type=checkbox]) {
  margin-bottom: var(--ld-spacer-4);
}
.ld-registration__login-form .login-username,
.ld-registration__login-form .login-password,
.ld-registration__login-form .login-submit,
.ld-registration__login-form .ld-registration__forgot-password,
.ld-registration__login-form .login-remember {
  margin: 0;
}
.ld-registration__login-form .login-remember {
  font-size: var(--ld-typography-desktop-body-size);
  line-height: var(--ld-typography-desktop-body-height);
  margin-bottom: var(--ld-spacer-4);
  padding: var(--ld-spacer-1) 0;
}
.ld-breakpoint--tablet .ld-registration__login-form .login-remember {
  margin-bottom: 0;
}
.ld-registration__login-form .login-remember input,
.ld-registration__login-form .login-remember label {
  margin-bottom: 0;
}
.ld-registration__login-form, .ld-registration__register-form, .ld-registration__forgot-password-form, .ld-registration__reset-password-form {
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
}
.ld-registration__login-form label, .ld-registration__register-form label, .ld-registration__forgot-password-form label, .ld-registration__reset-password-form label {
  display: block;
  font-size: var(--ld-typography-desktop-body-size);
  line-height: var(--ld-typography-desktop-body-height);
  margin-bottom: var(--ld-spacer-1);
}
.ld-registration__login-form input[type=email],
.ld-registration__login-form input[type=text],
.ld-registration__login-form input[type=password], .ld-registration__register-form input[type=email],
.ld-registration__register-form input[type=text],
.ld-registration__register-form input[type=password], .ld-registration__forgot-password-form input[type=email],
.ld-registration__forgot-password-form input[type=text],
.ld-registration__forgot-password-form input[type=password], .ld-registration__reset-password-form input[type=email],
.ld-registration__reset-password-form input[type=text],
.ld-registration__reset-password-form input[type=password] {
  font-size: var(--ld-typography-desktop-body-size);
  margin-left: 0;
  width: 100%;
}
.ld-registration__login-form input[type=checkbox], .ld-registration__register-form input[type=checkbox], .ld-registration__forgot-password-form input[type=checkbox], .ld-registration__reset-password-form input[type=checkbox] {
  margin-bottom: 3px;
}
.ld-registration__login-form input[name=confirm_password], .ld-registration__register-form input[name=confirm_password], .ld-registration__forgot-password-form input[name=confirm_password], .ld-registration__reset-password-form input[name=confirm_password] {
  margin-bottom: 0;
}
.ld-registration__login-form .login-submit, .ld-registration__register-form .login-submit, .ld-registration__forgot-password-form .login-submit, .ld-registration__reset-password-form .login-submit {
  font-size: var(--ld-typography-desktop-body-size);
  line-height: var(--ld-typography-desktop-body-height);
  padding-top: var(--ld-spacer-5);
}
.ld-breakpoint--tablet .ld-registration__login_options_wrapper {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.ld-registration__forgot-password {
  margin: 0;
}
.ld-breakpoint--tablet .ld-registration__forgot-password {
  text-align: right;
}

.ld-form .ld-form__field {
  margin-bottom: 0;
}
.ld-form .ld-form__field.ld-form__field-password.ld-form__field--valid {
  border-color: var(--ld-color-field-border-valid);
}
.ld-form .ld-form__field.ld-form__field-password.ld-form__field--valid:active, .ld-form .ld-form__field.ld-form__field-password.ld-form__field--valid:focus {
  border-color: var(--ld-color-field-border-valid);
}
.ld-form__field-wrapper {
  margin-bottom: var(--ld-spacer-4);
}

/**
 * Order details
 */
.ld-registration-order {
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
  padding-bottom: var(--ld-spacer-fixed-4);
  padding-top: var(--ld-spacer-fixed-6);
}
.ld-breakpoint--medium .ld-registration-order {
  box-sizing: border-box;
  flex: 0 0 33%;
  margin-bottom: var(--ld-spacer-fixed-9);
  max-width: 33%;
  padding-left: var(--ld-spacer-fixed-9);
  padding-right: var(--ld-spacer-fixed-9);
}
.ld-registration-order__heading {
  margin-bottom: var(--ld-spacer-5);
  margin-top: 0;
}
.ld-registration-order__items {
  max-width: 350px;
}
.logged-in .ld-registration-order__items {
  max-width: 100%;
}
.ld-breakpoint--medium .ld-registration-order__items {
  max-width: 100%;
}
.ld-registration-order__item-type {
  color: var(--ld-color-system-subtle);
  font-size: var(--ld-typography-desktop-caption-size);
  font-weight: var(--ld-typography-font-weight-bold);
  letter-spacing: 0.36px;
  line-height: var(--ld-typography-desktop-caption-height);
  text-transform: uppercase;
}
.ld-registration-order__item-details {
  display: flex;
  font-size: var(--ld-typography-desktop-body-size);
  justify-content: space-between;
  line-height: var(--ld-typography-desktop-body-height);
}
.ld-registration-order__item-title-wrapper {
  flex-grow: 2;
}
.ld-registration-order__item-price {
  margin-left: 10px;
  text-align: right;
  word-break: normal;
}
.ld-registration-order__item-price-value {
  text-align: right;
}
.ld-registration-order__item-price-original {
  color: var(--ld-color-system-subtle-text);
  visibility: hidden;
  font-size: var(--ld-typography-desktop-caption-size);
  line-height: var(--ld-typography-desktop-caption-height);
  text-align: right;
  text-decoration-line: line-through;
}
.ld-registration-order__items--with-coupon .ld-registration-order__item-price-original {
  visibility: visible;
}
.ld-registration-order__item-interval {
  font-size: var(--ld-typography-desktop-body-small-size);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-registration-order__item-trial-marker {
  background-color: var(--ld-color-system-middle-gray-light);
  border-radius: 5px;
  display: block;
  font-size: var(--ld-typography-desktop-caption-size);
  margin-bottom: 6px;
  margin-top: var(--ld-spacer-2);
  padding: 3px 9px;
  width: fit-content;
}
.ld-registration-order__total {
  border-top: 1px solid var(--ld-color-system-middle-gray);
  display: flex;
  font-size: var(--ld-typography-desktop-body-size);
  justify-content: space-between;
  line-height: var(--ld-typography-desktop-body-height);
  margin-top: var(--ld-spacer-fixed-5);
  padding-bottom: var(--ld-spacer-fixed-2);
  padding-top: var(--ld-spacer-fixed-2);
}
.ld-registration-order__total-title {
  flex-grow: 2;
  font-weight: var(--ld-typography-font-weight-bold);
}
.ld-registration-order__total-price {
  margin-left: 10px;
  text-align: right;
}
.ld-registration-order__return {
  border-top: 1px solid var(--ld-color-system-middle-gray);
  line-height: var(--ld-typography-desktop-button-text-height);
  margin-bottom: var(--ld-spacer-9);
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
  padding-top: var(--ld-spacer-2);
}
.ld-breakpoint--medium .ld-registration-order__return-wrapper {
  border-right: 1px solid var(--ld-color-system-middle-gray);
  box-sizing: border-box;
  flex: 0 0 100%;
  max-width: 67%;
  padding-right: var(--ld-spacer-9);
}
.ld-registration-order__return .dashicons {
  margin-right: var(--ld-spacer-fixed-1);
  text-decoration: none;
  vertical-align: middle;
}
.ld-registration-order__coupon-form-wrapper {
  border-top: 1px solid var(--ld-color-system-middle-gray);
  margin-top: var(--ld-spacer-fixed-5);
  padding-top: var(--ld-spacer-fixed-5);
}
.ld-registration-order__coupon-form-wrapper label {
  font-size: var(--ld-typography-desktop-body-size);
  font-weight: var(--ld-typography-font-weight-regular);
  line-height: var(--ld-typography-desktop-body-height);
}
.ld-registration-order__checkout-select {
  margin-bottom: var(--ld-spacer-fixed-5);
  margin-top: var(--ld-spacer-fixed-5);
  padding-bottom: var(--ld-spacer-fixed-3);
  padding-top: var(--ld-spacer-fixed-3);
}
.ld-registration-order__checkout-select-item {
  margin-bottom: var(--ld-spacer-fixed-2);
}
.ld-registration-order__checkout-select-item-main, .ld-registration-order__checkout-select-item-info {
  background-color: var(--ld-color-system-light-2);
  border: 1px solid var(--ld-color-system-middle-gray-light);
  border-radius: var(--ld-border-radius);
  padding: var(--ld-spacer-fixed-2);
}
.ld-breakpoint--medium .ld-registration-order__checkout-select-item-main, .ld-breakpoint--medium .ld-registration-order__checkout-select-item-info {
  padding: var(--ld-spacer-fixed-3) var(--ld-spacer-fixed-5) var(--ld-spacer-fixed-2);
}
.ld-registration-order__checkout-select-item-main {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
}
.ld-registration-order__checkout-select-item-main .ld-form__field-wrapper {
  display: flex;
}
.ld-registration-order__checkout-select-item-main .ld-form__field-wrapper span {
  font-size: var(--ld-typography-desktop-body-size);
  line-height: var(--ld-typography-desktop-body-height);
}
.ld-registration-order__checkout-select-item-info {
  border-color: var(--ld-color-brand-primary);
  display: none;
  font-size: var(--ld-typography-desktop-body-size);
  line-height: var(--ld-typography-desktop-body-height);
  margin-top: 3px;
  padding-bottom: var(--ld-spacer-fixed-3);
}
.ld-registration-order__checkout-select-item:first-child {
  margin-top: 0;
}
.ld-registration-order__checkout-select-item:last-child {
  margin-bottom: 0;
}
.ld-registration-order__checkout-select-item.ld--selected .ld-registration-order__checkout-select-item-main {
  border-color: var(--ld-color-brand-primary);
}
.ld-registration-order__checkout-select-item.ld--selected .ld-registration-order__checkout-select-item-meta .ld-svglogo {
  filter: none;
}
.ld-registration-order__checkout-select-item.ld--selected .ld-registration-order__checkout-select-item-info {
  display: block;
}
.ld-registration-order__checkout-select-item-meta {
  align-self: center;
  display: flex;
  height: fit-content;
  margin-left: var(--ld-spacer-fixed-2);
}
.ld-registration-order__checkout-select-item-meta .ld-svglogo {
  filter: grayscale(1);
  line-height: 0;
}
.ld-registration-order__checkout-select-item .ld-form__field-wrapper--type-radio {
  align-items: center;
  flex-grow: 2;
  font-weight: var(--ld-typography-font-weight-bold);
  margin-bottom: 0;
}
.ld-registration-order__checkout-select-item label {
  display: block;
  width: 100%;
}
.ld-registration-order__checkout-button {
  display: none;
}
.ld-registration-order__checkout-button #btn-join,
.ld-registration-order__checkout-button .button {
  width: auto;
}
.ld-registration-order__checkout-button.ld--selected {
  display: block;
}
.ld-registration-order .ppalholder {
  display: block;
  height: 0;
}

.ld-form__field-password-wrapper {
  margin-bottom: var(--ld-spacer-fixed-1);
}

.ld-form__field-coupon_field {
  width: 100%;
}
.ld-form__field-coupon_field-wrapper {
  display: flex;
  max-width: 450px;
}

.ld-form__coupon {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ld-button__coupon-apply {
  margin-left: 10px;
  overflow-wrap: break-word;
  white-space: normal;
  word-break: normal;
}

.ld-breakpoint--medium .ld-registration__wrapper--logged-in .ld-registration-order-wrapper {
  border-right: none;
  box-sizing: border-box;
  flex: 0 0 100%;
  max-width: 650px;
  padding-right: 0;
}

.ld-coupon {
  display: flex;
}
.ld-coupon__alerts {
  margin-left: auto;
  margin-right: auto;
  max-width: 650px;
}
.ld-coupon__wrapper {
  display: none;
}
.ld-registration-order__items--with-coupon .ld-coupon__wrapper {
  display: block;
}
.ld-coupon__details-wrapper {
  background-color: var(--ld-color-system-middle-gray-light);
  border-radius: 5px;
  display: none;
  padding: 7px 9px;
}
.ld-registration-order__items--with-coupon .ld-coupon__details-wrapper {
  display: inline-block;
}
.ld-coupon__remove {
  border: 0;
  cursor: pointer;
  font-size: var(--ld-typography-desktop-body-size);
  line-height: 0;
  margin: 0;
  padding: 0;
  text-decoration: none;
}
.ld-coupon__remove, .ld-coupon__remove:hover, .ld-coupon__remove:focus, .ld-coupon__remove:active {
  background-color: transparent;
  box-shadow: none;
}
.ld-coupon__remove:hover svg path {
  fill: #000;
}
.ld-coupon__remove:focus {
  color: inherit;
  outline: solid;
}
.ld-coupon__remove-form {
  align-self: center;
  display: flex;
  line-height: 0;
  margin-left: var(--ld-spacer-2);
  margin-bottom: 0;
  vertical-align: middle;
}
.ld-coupon__label-wrapper {
  display: flex;
}
.ld-coupon__label {
  align-self: center;
  display: flex;
}
.ld-coupon__label-text {
  align-self: center;
  display: inline-block;
  font-weight: var(--ld-typography-font-weight-bold);
  text-transform: uppercase;
  word-break: break-all;
}
.ld-coupon__label--coupon-icon {
  align-self: center;
  margin-right: var(--ld-spacer-1);
}
.ld-coupon__value {
  align-self: center;
  color: var(--ld-color-system-subtle-text);
  display: inline-block;
  font-size: var(--ld-typography-desktop-body-small-size);
  margin-left: var(--ld-spacer-fixed-4);
}
.ld-coupon .ld-svgicon__coupon {
  stroke: var(--ld-color-system-subtle);
}

.ld-enrollment {
  border-radius: var(--ld-border-radius-small);
  border: 1px solid var(--ld-color-system-border);
  color: var(--ld-color-system-body-text);
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-3);
  padding: var(--ld-spacer-4) var(--ld-spacer-fixed-3) var(--ld-spacer-5) var(--ld-spacer-fixed-3);
}
.ld-enrollment__king {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-0);
}
.ld-enrollment__king-label {
  font-size: var(--ld-typography-desktop-body-small-size);
  font-weight: var(--ld-typography-font-weight-regular);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-enrollment__king-description {
  font-size: var(--ld-typography-desktop-body-large-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-enrollment__subject {
  font-size: var(--ld-typography-desktop-body-small-size);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-enrollment__pricing, .ld-enrollment__access, .ld-enrollment__status {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-0);
}
.ld-enrollment__pricing-label, .ld-enrollment__status-label {
  font-size: var(--ld-typography-desktop-body-small-size);
  font-weight: var(--ld-typography-font-weight-regular);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-enrollment__pricing-price, .ld-enrollment__status-description {
  font-size: var(--ld-typography-desktop-body-large-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-enrollment__seats-remaining {
  font-size: var(--ld-typography-desktop-body-small-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-enrollment__join {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-2);
  /**
   * Some themes, like Kadence, may style both
   * .button and input[type="submit"] at the same time,
   * which would both apply to this button in many cases.
   *
   * Nesting the selector like this ensures that
   * we're specific enough to override theme styles.
   */
}
.ld-enrollment__join form {
  margin: 0;
}
.ld-enrollment__join .ld-enrollment__join-button, .ld-enrollment__join .ld-enrollment__join-button:hover, .ld-enrollment__join .ld-enrollment__join-button:focus {
  all: unset;
  background-color: var(--ld-color-button-bg);
  border-radius: var(--ld-border-radius-small);
  border: none;
  box-shadow: none;
  color: var(--ld-color-system-white);
  font-size: var(--ld-typography-mobile-body-large-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-mobile-body-large-height);
  margin: 0;
  padding: var(--ld-spacer-3) var(--ld-spacer-fixed-5);
  text-decoration: none;
  white-space: normal;
}
.ld-enrollment__join .ld-enrollment__join-button:hover, .ld-enrollment__join .ld-enrollment__join-button:focus {
  background-color: var(--ld-color-button-bg-hover);
}
.ld-enrollment__join .ld-enrollment__join-button:hover {
  cursor: pointer;
}
.ld-enrollment__join .ld-enrollment__join-button:focus {
  outline-offset: 2px;
  outline: 2px solid var(--ld-color-button-bg-hover);
}
.ld-enrollment__login {
  display: flex;
  flex-direction: row;
  gap: var(--ld-spacer-fixed-1);
}
.ld-enrollment__login-text {
  font-size: var(--ld-typography-desktop-caption-size);
  font-weight: var(--ld-typography-font-weight-regular);
  line-height: var(--ld-typography-desktop-caption-height);
}
.ld-enrollment__login-link {
  color: var(--ld-color-brand-primary);
  font-size: var(--ld-typography-desktop-caption-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-caption-height);
  text-decoration: underline;
}

.ld-details {
  border-radius: var(--ld-border-radius-small);
  border: 1px solid var(--ld-color-system-border);
  color: var(--ld-color-system-body-text);
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-5);
  padding: var(--ld-spacer-5) var(--ld-spacer-fixed-4) var(--ld-spacer-6) var(--ld-spacer-fixed-4);
}
.ld-details__section {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-1);
}
.ld-details__heading {
  font-size: var(--ld-typography-desktop-body-large-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-body-large-height);
  margin-bottom: var(--ld-spacer-1);
}
.ld-details__item {
  display: flex;
  gap: var(--ld-spacer-fixed-0);
}
.ld-details__label {
  font-size: var(--ld-typography-desktop-body-small-size);
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-details__link {
  color: var(--ld-color-system-body-text);
}
.ld-details__link:hover, .ld-details__link:focus {
  color: var(--ld-color-brand-primary);
}
.ld-details__link:focus {
  border-radius: var(--ld-border-radius-small);
  outline: solid 2px var(--ld-color-brand-primary);
}
.ld-details__icon-wrapper {
  align-items: center;
  display: flex;
  max-height: var(--ld-typography-desktop-body-small-height);
}
.ld-details__icon {
  height: 18px;
  width: 18px;
}

.ld-accordion {
  display: flex;
  flex-direction: column;
  /**
   * Ensures that we cannot tab into a collapsed accordion.
   *
   * This happens because [hidden] is a browser-level style
   * and is considered very low specificity.
   *
   * If we force it to be display: none, it looks the same
   * and ensures that we cannot tab into the hidden content even
   * if the container is normally something like display: flex.
   *
   * https://css-tricks.com/the-hidden-attribute-is-visibly-weak/
   */
}
.ld-accordion__header {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-2);
  margin: var(--ld-spacer-2) 0 var(--ld-spacer-3) 0;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__header {
  gap: var(--ld-spacer-fixed-1);
}
.ld-accordion__subheading {
  font-size: var(--ld-typography-desktop-body-large-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-body-height);
  padding: var(--ld-spacer-4) var(--ld-spacer-fixed-2) var(--ld-spacer-1) var(--ld-spacer-fixed-2);
}
.ld-accordion__content {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-3);
}
.ld-accordion__section, .ld-accordion__items, .ld-accordion__item-steps-container, .ld-accordion__item-steps {
  display: flex;
  flex-direction: column;
}
.ld-accordion__section, .ld-accordion__item-steps {
  gap: var(--ld-spacer-2);
}
.ld-accordion__item-steps[hidden=hidden] {
  display: none;
}
.ld-accordion__items, .ld-accordion__item-steps-container {
  gap: var(--ld-spacer-4);
}
.ld-accordion__items--lessons, .ld-accordion__item-steps-container--lessons {
  gap: var(--ld-spacer-2);
}
.ld-accordion__section {
  border: 1px solid var(--ld-color-system-border);
  border-radius: var(--ld-border-radius-small);
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-2) var(--ld-spacer-6) var(--ld-spacer-fixed-2);
}
.ld-accordion__item-steps {
  gap: var(--ld-spacer-5);
  grid-area: attributes;
  overflow: hidden;
  position: relative;
  transition: all 0.3s ease;
}
.ld-accordion__item-steps.ld-expanded {
  /**
   * Ensure Tooltips are visible if they would expand
   * outside the collapsible element.
   */
  overflow: visible;
}
.ld-accordion__item-steps [data-ld-tooltip-text] {
  /**
   * Don't position Tooltips based on the element
   * they're associated with.
   *
   * This is counter-intuitive, but necessary
   * to ensure they are positioned correctly when taking
   * into account the expandable nature of accordions.
   */
  position: inherit;
}
.ld-accordion__item-steps [data-ld-tooltip-text]::after {
  bottom: auto;
  /**
   * To account for issues with positioning if the
   * tooltip spills to a second line, we need calculate
   * what it _should be_ and use it only if it is less
   * than 100% of the container.
   */
  transform: translate(-1%, min(24px + var(--ld-typography-desktop-body-small-size) + var(--ld-spacer-1), 100%));
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-steps [data-ld-tooltip-text]::after {
  transform: translate(0, min(24px + var(--ld-typography-desktop-body-small-size) + var(--ld-spacer-1), 100%));
}
.ld-accordion__item-steps-container {
  /**
   * Padding is placed here to ensure it doesn't
   * interfere with how height and overflow are calculated.
   */
  padding: var(--ld-spacer-2) 0;
}
.ld-accordion__expand-button, .ld-accordion__expand-button:hover, .ld-accordion__expand-button:focus {
  all: unset;
  align-items: center;
  color: var(--ld-color-system-body-text);
  display: flex;
  font-size: var(--ld-typography-desktop-body-size);
  font-style: normal;
  gap: var(--ld-spacer-fixed-1);
  line-height: var(--ld-typography-desktop-body-height);
  padding-bottom: var(--ld-spacer-0);
}
.ld-accordion__expand-button:hover {
  color: var(--ld-color-brand-primary);
  cursor: pointer;
}
.ld-accordion__expand-button:focus-visible {
  border-radius: var(--ld-border-radius-small);
  outline: solid 2px var(--ld-color-brand-primary);
}
.ld-accordion__expand-button--all, .ld-accordion__expand-button--all:hover, .ld-accordion__expand-button--all:focus {
  font-weight: var(--ld-typography-font-weight-medium);
}
.ld-accordion__expand-button--all:hover {
  border-bottom: 2px solid var(--ld-color-brand-primary);
  margin-bottom: -2px;
}
.ld-accordion__expand-button--lesson, .ld-accordion__expand-button--lesson:hover, .ld-accordion__expand-button--lesson:focus {
  font-weight: var(--ld-typography-font-weight-bold);
}
.ld-accordion__expand-button--lesson:hover .ld-accordion__expand-button-text {
  border-bottom: 2px solid var(--ld-color-brand-primary);
  margin-bottom: -2px;
}
.ld-accordion__expand-button .ld-accordion__expand-button-icon--collapse {
  display: none;
}
.ld-accordion__expand-button[aria-expanded=true] .ld-accordion__expand-button-icon--expand {
  display: none;
}
.ld-accordion__expand-button[aria-expanded=true] .ld-accordion__expand-button-icon--collapse {
  display: inline-block;
}
.ld-accordion__item {
  border-radius: var(--ld-border-radius);
  transition: all 0.3s ease;
}
.ld-accordion__item--lesson {
  display: grid;
  grid-template-areas: "title expand" "attributes attributes";
  grid-template-columns: 1fr min-content;
}
.ld-accordion__item--final-quiz {
  padding: var(--ld-spacer-1) var(--ld-spacer-fixed-2);
}
.ld-accordion__item--topic, .ld-accordion__item--lesson-quiz, .ld-accordion__item--topic-quiz, .ld-accordion__item--final-quiz {
  column-gap: var(--ld-spacer-fixed-1);
  display: grid;
  grid-template-areas: "icon title" "icon attributes";
  grid-template-columns: min-content auto;
}
.ld-accordion__item--topic, .ld-accordion__item--lesson-quiz {
  padding: 0 var(--ld-spacer-fixed-9) 0 var(--ld-spacer-fixed-2);
}
.ld-accordion__item--topic-quiz {
  padding: 0 var(--ld-spacer-fixed-2) 0 0;
}
.ld-accordion__item--topic-quiz:first-of-type {
  padding-top: var(--ld-spacer-1);
}
.ld-accordion__item .ld-accordion__expand-button {
  font-size: var(--ld-typography-desktop-caption-size);
  grid-area: expand;
  justify-content: flex-end;
  letter-spacing: 1px;
  line-height: var(--ld-typography-desktop-caption-height);
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-5);
  text-transform: uppercase;
  /**
   * On mobile, always hide the Expand/Collapse text visually.
   * Screen readers can always see it when styled this way.
   */
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item .ld-accordion__expand-button {
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-2) var(--ld-spacer-2) var(--ld-spacer-fixed-5);
}
.ld-accordion__item .ld-accordion__expand-button .ld-accordion__expand-button-text {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.ld-accordion__item:has(.ld-accordion__expand-button[aria-expanded=true]), .ld-accordion__item:hover, .ld-accordion__item:focus-within {
  background-color: var(--ld-color-system-light-2);
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item:has(.ld-accordion__expand-button[aria-expanded=true]), .ld-accordion.ld-breakpoint--small .ld-accordion__item:hover, .ld-accordion.ld-breakpoint--small .ld-accordion__item:focus-within {
  /**
   * This border should only be visible when:
   *
   * 1. The user is hovering over the Lesson.
   * 2. The user is focused somewhere within the Lesson.
   * 3. The Lesson is collapsed.
   */
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item:has(.ld-accordion__expand-button[aria-expanded=true]) .ld-accordion__expand-button, .ld-accordion.ld-breakpoint--small .ld-accordion__item:hover .ld-accordion__expand-button, .ld-accordion.ld-breakpoint--small .ld-accordion__item:focus-within .ld-accordion__expand-button {
  position: relative;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item:has(.ld-accordion__expand-button[aria-expanded=true]) .ld-accordion__expand-button[aria-expanded=false]::before, .ld-accordion.ld-breakpoint--small .ld-accordion__item:hover .ld-accordion__expand-button[aria-expanded=false]::before, .ld-accordion.ld-breakpoint--small .ld-accordion__item:focus-within .ld-accordion__expand-button[aria-expanded=false]::before {
  background: var(--ld-color-system-middle-gray);
  bottom: var(--ld-spacer-0);
  content: "";
  left: 0;
  position: absolute;
  top: var(--ld-spacer-0);
  width: 1px;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item {
  /**
   * On Desktop, show the Expand/Collapse text:
   *
   * 1. The user is hovering over the Lesson.
   * 2. The user is focused somewhere within the Lesson.
   * 3. The Lesson is expanded.
   */
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item--lesson {
  grid-template-columns: auto minmax(160px, min-content);
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item:hover .ld-accordion__expand-button .ld-accordion__expand-button-text, .ld-accordion.ld-breakpoint--small .ld-accordion__item:focus-within .ld-accordion__expand-button .ld-accordion__expand-button-text {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: relative;
  width: auto;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item:hover .ld-accordion__expand-button:hover .ld-accordion__expand-button-text, .ld-accordion.ld-breakpoint--small .ld-accordion__item:focus-within .ld-accordion__expand-button:hover .ld-accordion__expand-button-text {
  border-bottom: 2px solid var(--ld-color-brand-primary);
  margin-bottom: -2px;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item .ld-accordion__expand-button[aria-expanded=true] .ld-accordion__expand-button-text {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: relative;
  width: auto;
}
.ld-accordion__item-header {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-1);
}
.ld-accordion__item-header--lesson, .ld-accordion__item-header--final-quiz {
  position: relative;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-header--lesson, .ld-accordion.ld-breakpoint--small .ld-accordion__item-header--final-quiz {
  position: inherit;
}
.ld-accordion__item-header--lesson [data-ld-tooltip-text], .ld-accordion__item-header--final-quiz [data-ld-tooltip-text] {
  /**
   * Don't position Tooltips based on the element
   * they're associated with.
   *
   * This is counter-intuitive, but necessary
   * to ensure they are positioned correctly when taking
   * into account the expandable nature of accordions.
   */
  position: inherit;
}
.ld-accordion__item-header--lesson [data-ld-tooltip-text]::after, .ld-accordion__item-header--final-quiz [data-ld-tooltip-text]::after {
  bottom: auto;
  left: auto;
  /**
   * To account for issues with positioning if the
   * tooltip spills to a second line, we need calculate
   * what it _should be_ and use it only if it is less
   * than 100% of the container.
   */
  transform: translate(-1%, min(24px + var(--ld-typography-desktop-body-small-size) + var(--ld-spacer-1), 100%));
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-header--lesson [data-ld-tooltip-text]::after, .ld-accordion.ld-breakpoint--small .ld-accordion__item-header--final-quiz [data-ld-tooltip-text]::after {
  transform: translate(0%, min(24px + var(--ld-typography-desktop-body-small-size) + var(--ld-spacer-1), 100%));
  right: auto;
}
.ld-accordion__item-header--lesson {
  padding: var(--ld-spacer-1) 0 var(--ld-spacer-fixed-1) var(--ld-spacer-2);
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-header--lesson {
  padding: var(--ld-spacer-2) var(--ld-spacer-fixed-2) var(--ld-spacer-1) var(--ld-spacer-fixed-2);
}
.ld-accordion__item-header--lesson [data-ld-tooltip-text]::after {
  /**
   * Fixes a very specific edge case with positioning of the tooltips
   * only in the Lesson Header.
   *
   * The Expand/Collapse button and the way the icons
   * get positioned in relation to it causes us some issues.
   */
  left: 0;
  right: 0;
}
.ld-accordion.ld-breakpoint--mobile .ld-accordion__item-header--lesson [data-ld-tooltip-text]::after {
  left: auto;
}
.ld-accordion.ld-breakpoint--tablet .ld-accordion__item-header--lesson [data-ld-tooltip-text]::after {
  left: 0;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-header--lesson [data-ld-tooltip-text]::after {
  left: auto;
}
.ld-accordion__item-icon {
  grid-area: icon;
}
.ld-accordion__item-icon--progress {
  color: var(--ld-color-brand-primary);
}
.ld-accordion__item-title {
  color: var(--ld-color-system-body-text);
  font-size: var(--ld-typography-desktop-h6-size);
  grid-area: title;
  line-height: var(--ld-typography-desktop-h6-height);
  /**
   * Item Title Tooltips, specifically,
   * need to use styling closer to the default Tooltip styling.
   */
}
.ld-accordion__item-title:is(a):hover, .ld-accordion__item-title:is(a):focus {
  color: var(--ld-color-brand-primary);
  text-decoration: underline;
}
.ld-accordion__item-title:is(a):focus {
  outline: solid 2px var(--ld-color-brand-primary);
}
.ld-accordion__item-title[data-ld-tooltip-text] {
  position: relative;
}
.ld-accordion__item-title[data-ld-tooltip-text]::after {
  left: 0;
  /**
   * To account for issues with positioning if the
   * tooltip spills to a second line, we need calculate
   * what it _should be_ and use it only if it is less
   * than 100% of the container.
   */
  transform: translate(-1%, min(24px + var(--ld-spacer-1), 100%));
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-title[data-ld-tooltip-text]::after {
  left: 0;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-title[data-ld-tooltip-text]::after {
  transform: translate(0, min(24px + var(--ld-spacer-1), 100%));
}
.ld-accordion__item-attributes {
  display: flex;
  flex-wrap: wrap;
  font-size: var(--ld-typography-desktop-body-small-size);
  gap: var(--ld-spacer-fixed-1);
  grid-area: attributes;
  line-height: var(--ld-typography-desktop-body-small-height);
}
.ld-accordion__item-attribute {
  align-items: center;
  display: inline-flex;
  gap: var(--ld-spacer-fixed-0);
}
.ld-accordion__item-attribute--collapsible, .ld-accordion__item-attribute--collapsed {
  background: var(--ld-color-system-middle-gray-light);
  border-radius: var(--ld-border-radius);
  display: flex;
  font-size: var(--ld-typography-desktop-caption-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-caption-height);
  text-transform: uppercase;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-attribute--collapsible {
  display: inline-flex;
  letter-spacing: 1px;
  padding-right: var(--ld-spacer-1);
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-attribute--collapsible[data-ld-tooltip-text]:hover::after, .ld-accordion.ld-breakpoint--small .ld-accordion__item-attribute--collapsible[data-ld-tooltip-text]:focus::after, .ld-accordion.ld-breakpoint--small .ld-accordion__item-attribute--collapsible[data-ld-tooltip-text]:focus-within::after {
  visibility: hidden;
}
.ld-accordion__item-attribute--available-on {
  background: var(--ld-color-brand-secondary);
}
.ld-accordion__item-attribute--topics .ld-accordion__item-attribute-icon, .ld-accordion__item-attribute--quizzes .ld-accordion__item-attribute-icon {
  display: none;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-attribute--topics .ld-accordion__item-attribute-icon, .ld-accordion.ld-breakpoint--small .ld-accordion__item-attribute--quizzes .ld-accordion__item-attribute-icon {
  display: inline-block;
  height: auto;
  width: 16px;
}
.ld-accordion__item-attribute-icon--progress {
  color: var(--ld-color-brand-primary);
}
.ld-accordion__item-attribute-icon--available-on {
  color: var(--ld-color-brand-secondary);
}
.ld-accordion__item-attribute-label--collapsible {
  display: none;
}
.ld-accordion.ld-breakpoint--small .ld-accordion__item-attribute-label--collapsible {
  display: inline-block;
}
.ld-accordion__pagination {
  color: var(--ld-color-system-body-text);
  font-size: var(--ld-typography-desktop-caption-size);
  font-weight: var(--ld-typography-font-weight-bold);
  line-height: var(--ld-typography-desktop-caption-size);
  /**
   * 8px, accounting for the 4px padding on the buttons themselves.
   *
   * Bottom padding is intentionally 0 as the
   * container has its own bottom padding.
   *
   * Top padding is being handled by the gap attribute on the parent element.
   */
  padding: 0 var(--ld-spacer-fixed-1);
}
.ld-accordion__pagination-list {
  align-items: center;
  display: flex;
  gap: var(--ld-spacer-2);
}
.ld-accordion .ld-accordion__pagination-list,
.ld-accordion .ld-accordion__pagination-list-item {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.ld-accordion__pagination-button, .ld-accordion__pagination-button:hover, .ld-accordion__pagination-button:focus {
  all: unset;
  box-sizing: border-box;
  padding: var(--ld-spacer-0) var(--ld-spacer-fixed-0);
}
.ld-accordion__pagination-button:disabled {
  opacity: 0.6;
}
.ld-accordion__pagination-button:hover, .ld-accordion__pagination-button:focus {
  color: var(--ld-color-brand-primary);
}
.ld-accordion__pagination-button:focus {
  border-radius: var(--ld-border-radius-small);
  outline: solid 2px var(--ld-color-brand-primary);
}
.ld-accordion__pagination-button:hover {
  cursor: pointer;
}
.ld-accordion__pagination-button:hover:disabled {
  color: inherit;
  cursor: not-allowed;
}

[data-ld-tooltip-text] {
  position: relative;
}
[data-ld-tooltip-text]::after {
  background: var(--ld-color-system-middle-gray-light);
  border-radius: var(--ld-border-radius-small);
  border: 1px solid #cbd5e0;
  bottom: 0;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25);
  color: var(--ld-color-system-body-text);
  content: attr(data-ld-tooltip-text);
  font-size: var(--ld-typography-desktop-body-small-size);
  font-weight: var(--ld-typography-font-weight-medium);
  line-height: var(--ld-typography-desktop-body-small-height);
  padding: var(--ld-spacer-0) var(--ld-spacer-fixed-1);
  position: absolute;
  text-transform: none;
  visibility: hidden;
  z-index: 999;
}
[data-ld-tooltip-text]:hover::after, [data-ld-tooltip-text]:focus::after, [data-ld-tooltip-text]:focus-within::after {
  visibility: visible;
}

.ld-alerts {
  display: flex;
  flex-direction: column;
  gap: var(--ld-spacer-3);
}
.ld-alerts .ld-alert {
  flex-grow: 1;
  margin-bottom: 0;
  margin-top: 0;
}
