/* The existing theme owns typography, buttons, forms and layout. */
.seminar-archive-block {
  margin-block-end: var(--space-8);
  padding-block-end: var(--space-6);
  border-block-end: 1px solid var(--line);
}

.seminar-archive-block h2 {
  margin-block-end: var(--space-5);
}

.seminar-archive-video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 0;
}

.seminar-archive-portrait {
  width: 10rem;
  height: 10rem;
  object-fit: cover;
  border-radius: var(--radius-sm);
  margin-block-end: var(--space-4);
}

.seminar-archive-download {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--accent);
  overflow-wrap: anywhere;
}

.seminar-archive-download > span:first-child {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.seminar-archive-download svg {
  flex-shrink: 0;
}

.certification-grid.seminar-archive-certifications {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}

.seminar-archive-certifications .card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-3);
}

.seminar-archive-certifications .certification-logo {
  margin: 0;
}

.seminar-archive-cta {
  margin-block-start: var(--space-8);
  padding: var(--space-6);
  border-radius: var(--radius-lg);
  background: var(--accent-soft);
  text-align: center;
}

.seminar-archive-cta h2,
.member-portal-content .seminar-archive-cta h2 {
  display: block;
  text-align: center;
  margin-block-end: var(--space-3);
  color: var(--ink);
  font-size: var(--font-size-2xl);
}

.seminar-archive-cta .seminar-archive-cta__copy {
  margin-block-end: var(--space-5);
  color: var(--ink-soft);
  text-align: center;
  text-wrap: balance;
}

.seminar-archive-cta .seminar-archive-certifications {
  margin-block-end: 0;
}

@media (max-width: 599px) {
  .seminar-archive-cta {
    padding: var(--space-4);
  }
}

.doc-body .seminar-archive-card .seminar-card__title {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: var(--font-size-xl);
  line-height: var(--leading-base);
}

.seminar-archive-card .seminar-card__content {
  min-width: 0;
}

.seminar-archive-card .seminar-card__title,
.seminar-archive-card .seminar-card__summary {
  overflow-wrap: anywhere;
}

.seminar-archive-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  aspect-ratio: 16 / 9;
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  background: var(--accent-soft);
  color: var(--accent-2);
  font-family: var(--display);
  font-size: var(--font-size-xs);
  letter-spacing: var(--tracking-wider);
}

.seminar-archive-placeholder img {
  width: 60%;
  height: auto;
}

.seminar-archive-placeholder svg {
  flex-shrink: 0;
}

/* Keep the archive cards compact within the document layout. */
.doc-body .seminar-archive-card {
  padding: var(--space-4);
  gap: var(--space-5);
}

.doc-body .seminar-archive-card .seminar-card__content {
  gap: var(--space-2);
}

.doc-body .seminar-archive-card .seminar-card__summary,
.doc-body .seminar-archive-card .seminar-card__schedule {
  margin: 0;
}

.doc-body .seminar-archive-card .seminar-card__schedule li {
  align-items: center;
  flex-wrap: wrap;
}

.doc-layout--subpage.container.seminar-archive-detail {
  width: min(1080px, calc(100% - var(--space-5) * 2));
  grid-template-columns: minmax(0, 1fr);
}

.seminar-archive-locked {
  margin: 0;
  background: var(--paper);
}

.seminar-archive-unlock {
  display: grid;
  place-items: center;
  min-height: 100svh;
  padding: var(--space-6);
}

.seminar-archive-unlock__panel {
  width: min(100%, 420px);
  text-align: center;
}

.seminar-archive-unlock__icon {
  margin: 0 auto var(--space-5);
  color: var(--ink-soft);
}

.seminar-archive-unlock h1 {
  margin: 0 0 var(--space-6);
  font-size: var(--font-size-xl);
  line-height: var(--leading-base);
}

.seminar-archive-unlock__form .form-row {
  display: grid;
  gap: var(--space-2);
  text-align: left;
}

.seminar-archive-unlock__form .form-actions {
  margin-top: var(--space-4);
}

.seminar-archive-unlock__form .btn {
  width: 100%;
}

.seminar-archive-password {
  position: relative;
}

.seminar-archive-password .form-input {
  padding-inline-end: 3.5rem;
}

.seminar-archive-password__toggle {
  position: absolute;
  inset-block: 0;
  right: 0;
  display: grid;
  place-items: center;
  width: 3.25rem;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--ink-soft);
  cursor: pointer;
}

.seminar-archive-password__toggle[hidden],
.seminar-archive-password .form-input[type="password"] + button .seminar-archive-password__slash {
  display: none;
}

.seminar-archive-password__toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -3px;
}


/* The member login uses a compact, horizontal form below the page title. */
.seminar-archive-unlock.member-access {
  min-height: auto;
  padding: var(--space-10) var(--space-5);
}

.seminar-archive-unlock.member-access .member-side-module {
  width: min(100%, 760px);
  padding: var(--space-7) var(--space-8);
  text-align: left;
}

.seminar-archive-unlock .member-login {
  max-width: none;
  gap: var(--space-5);
}

.seminar-archive-unlock .member-login .form-row {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr);
  align-items: center;
  gap: var(--space-5);
}

.seminar-archive-unlock .member-login .form-row__label {
  margin: 0;
}

.seminar-archive-unlock .member-login .form-input,
.seminar-archive-unlock .member-login .member-password {
  min-width: 0;
  width: 100%;
}

.seminar-archive-unlock .member-side-module .member-login .btn {
  width: min(240px, 100%);
  justify-self: center;
  margin-block-start: var(--space-2);
}

@media (max-width: 599px) {
  .seminar-archive-unlock.member-access {
    padding-block: var(--space-8);
  }

  .seminar-archive-unlock.member-access .member-side-module {
    padding: var(--space-5) var(--space-4);
  }

  .seminar-archive-unlock .member-login .form-row {
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: var(--space-3);
  }
}

/* Show the current password visibility in the member login icon. */
.seminar-archive-unlock .member-password__slash {
  display: block;
}

.seminar-archive-unlock .member-password__toggle[aria-pressed="true"] .member-password__slash {
  display: none;
}

/* Preserve the native reset form while matching the member login layout. */
.member-access .lost_reset_password .clear {
  display: none;
}

.member-access .lost_reset_password .form-row:has(> button[type="submit"]) {
  display: flex;
  justify-content: center;
}

.member-access .member-login .form-row {
  float: none;
  width: 100%;
}

.member-access .member-login > p:not(.form-row) {
  margin: 0;
}

.member-access .member-side-module > .section__cta {
  margin-block: var(--space-5) 0;
}

.member-access .lost_reset_password .form-row::before,
.member-access .lost_reset_password .form-row::after {
  display: none;
}

.member-access .member-login .form-row:has(#user_login) {
  grid-template-columns: 10rem minmax(0, 1fr);
}

.member-access label[for="user_login"] > span:not(.screen-reader-text) {
  display: block;
  white-space: nowrap;
}

@media (max-width: 599px) {
  .member-access .member-login .form-row:has(#user_login) {
    grid-template-columns: 8rem minmax(0, 1fr);
  }
}

/* Account notices share the site's colors, spacing and form corners. */
.member-access .woocommerce-message,
.member-access .woocommerce-info,
.member-access .woocommerce-error {
  margin: 0 0 var(--space-5);
  padding: var(--space-4) var(--space-5) var(--space-4) var(--space-8);
  border: 1px solid var(--accent-alpha-30);
  border-radius: var(--radius-sm);
  background: var(--accent-soft);
  color: var(--ink);
  font-family: var(--sans-jp);
  font-size: var(--font-size-sm);
  line-height: var(--leading-base);
  box-shadow: none;
}

.member-access .woocommerce-message::before,
.member-access .woocommerce-info::before,
.member-access .woocommerce-error::before {
  top: var(--space-4);
  left: var(--space-4);
  color: var(--accent);
}

.member-access .woocommerce-error {
  border-color: var(--error);
  background: var(--paper);
}

.member-access .woocommerce-error::before {
  color: var(--error);
}
