.tsj-subscription-subscription-selector {
  color: var(--wp--preset--color--black);
}

.tsj-subscription-subscription-selector picture,
.tsj-subscription-subscription-selector img {
  display: block;
}

.tsj-subscription-subscription-selector .text-block {
  background-color: var(--wp--preset--color--white);
  margin: 0 auto;
  padding: 3rem 0;
  width: 100%;
}

.tsj-subscription-subscription-selector .wp-block-post-title {
  font-size: var(--typography--font-size--display-3);
  margin-top: 0;
}

.tsj-subscription-subscription-selector .top-portion {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}

.tsj-subscription-subscription-selector .base-selector {
  font-size: var(--typography--font-size--paragraph-2);
  font-weight: 400;
  line-height: 1;
}

.tsj-subscription-subscription-selector .link-button {
  background: none;
  border: none;
  cursor: pointer;
  font-size: var(--typography--font-size--paragraph-2);
  font-weight: 400;
  padding: 0;
  text-decoration: underline;
}

.tsj-subscription-subscription-selector .link-button.greyed {
  color: #767676;
  text-decoration: none;
}

.tsj-subscription-subscription-selector .top-portion p {
  font-size: var(--typography--font-size--paragraph-2);
  font-weight: 400;
  margin: 0;
}

.tsj-subscription-subscription-selector .options-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  transition: height 200ms ease;
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .options-wrapper .annual-options,
body:not(.wp-admin) .tsj-subscription-subscription-selector .options-wrapper .monthly-options {
  grid-area: 1 / 1 / 2 / 2;
  visibility: hidden;
  height: fit-content;
  opacity: 0;
  transition: opacity 600ms ease;
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .options-wrapper .annual-options.showing,
body:not(.wp-admin) .tsj-subscription-subscription-selector .options-wrapper .monthly-options.showing {
  visibility: visible;
  opacity: 1;
}

.tsj-subscription-subscription-selector .subscription-option {
  border-top: 1px solid var(--wp--preset--color--black);
  display: flex;
  margin-bottom: 1.5rem;
  padding: 1.5rem 0;
}

.tsj-subscription-subscription-selector .subscription-option .subscription-option-content {
  flex: auto;
}

.tsj-subscription-subscription-selector .subscription-option:last-child {
  border-bottom: 1px solid var(--wp--preset--color--black);
}

.tsj-subscription-subscription-selector .subscription-option label {
  align-items: baseline;
  display: flex;
  font-weight: 400;
}

.tsj-subscription-subscription-selector .subscription-option input {
  accent-color: var(--wp--preset--color--black);
  margin: 0 0 0 0.75rem;
}

.tsj-subscription-subscription-selector .subscription-option .title {
  font-size: var(--typography--font-size--heading-4);
  line-height: 1.06;
  margin-bottom: 1rem;
  margin-top: 0;
}

.tsj-subscription-subscription-selector .subscription-option .title .cost {
  font-family: var(--wp--custom--font-family--body);
  font-size: var(--typography--font-size--paragraph-2);
  line-height: 1;
  margin-left: auto;
}

.tsj-subscription-subscription-selector .subscription-option .description ul {
  list-style: inside;
  padding: 0;
}

.tsj-subscription-subscription-selector .subscription-option .image {
  margin-right: 1rem;
  max-width: 6.25rem;
}

.tsj-subscription-subscription-selector .gift-toggle-label {
  font-weight: 400;
  font-size: var(--typography--font-size--paragraph-2);
}

.tsj-subscription-subscription-selector .gift-toggle-label input {
  accent-color: var(--wp--preset--color--black);
}

.tsj-subscription-subscription-selector .form-section-title {
  font-family: var(--wp--custom--font-family--heading);
  font-size: var(--typography--font-size--display-3);
  font-weight: 400;
  margin-top: 3rem;
  margin-bottom: 2rem;
  text-transform: uppercase;
  text-align: center;
}

.tsj-subscription-subscription-selector .form-section-wrapper .field-group {
  border-bottom: 1px solid var(--wp--preset--color--black);
  padding: 1.375rem 0 0.375rem;
  position: relative;
}

.tsj-subscription-subscription-selector .form-section-wrapper .field-group:first-of-type {
  border-top: 1px solid var(--wp--preset--color--black);
}

.tsj-subscription-subscription-selector .form-section-wrapper .field-group label {
  line-height: 1;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--wp--preset--font-family--practice);
  font-size: var(--typography--font-size--heading-6);
  font-weight: 400;
  transition: all ease 125ms;
}

.tsj-subscription-subscription-selector .form-section-wrapper .field-group label.floating {
  font-size: var(--typography--font-size--label-3);
  transform: translateY(0);
  top: 0.625rem;
}

.tsj-subscription-subscription-selector .form-section-wrapper .field-group input {
  border: none !important;
  margin-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.tsj-subscription-subscription-selector .start-issue-wrapper {
  align-items: center;
  background-color: #EAEAEA;
  cursor: pointer;
  display: flex;
  margin-bottom: 2rem;
  margin-top: 3rem;
  padding: 1.25rem;
}

.tsj-subscription-subscription-selector .start-issue-wrapper:hover,
.tsj-subscription-subscription-selector .start-issue-wrapper:focus,
.tsj-subscription-subscription-selector .start-issue-wrapper:focus-visible,
.tsj-subscription-subscription-selector .start-issue-wrapper:focus-within {
  background-color: #ffffff;
}

.tsj-subscription-subscription-selector .start-issue-wrapper .image {
  margin-right: 1rem;
  max-width: 4.9375rem;
}

.tsj-subscription-subscription-selector .start-issue-wrapper .title,
.tsj-subscription-subscription-selector .start-issue-wrapper .description {
  font-size: var(--typography--font-size--paragraph-2);
  font-family: var(--wp--custom--font-family--body);
  line-height: var(--typography--line-height--paragraph-2);
}
.tsj-subscription-subscription-selector .start-issue-wrapper .description .cover u {
  text-decoration: none;
}
.tsj-subscription-subscription-selector .start-issue-wrapper .title {
  margin-bottom: 0.5rem;
  margin-top: 0;
}

.tsj-subscription-subscription-selector .start-issue-wrapper .title label {
  pointer-events: none;
  font-weight: 400;
}

.tsj-subscription-subscription-selector .start-issue-wrapper .description {
  color: #767676;
}

.tsj-subscription-subscription-selector .start-issue-wrapper input {
  appearance: none;
  background-color: transparent;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguNSA3LjVIMTJWOC41SDguNVYxMkg3LjVWOC41SDRWNy41SDcuNVY0SDguNVY3LjVaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 80%;
  border: 1px solid var(--wp--preset--color--black) !important;
  border-radius: 100%;
  cursor: pointer;
  flex-shrink: 0;
  height: 1.5rem;
  margin: 0 0 0 1rem;
  padding: 0;
  width: 1.5rem;
}

.tsj-subscription-subscription-selector .start-issue-wrapper input:checked {
  background-color: var(--wp--preset--color--black);
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjA2ODcgNS4zNTM1Mkw2LjYyMjY3IDExLjIwN0wyLjkyOTY5IDcuODUzNTJMMy43MDgyOSA3LjE0NjQ4TDYuNjIyNjcgOS43OTI5N0wxMi4yOTAxIDQuNjQ2NDhMMTMuMDY4NyA1LjM1MzUyWiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==);
}

.tsj-subscription-subscription-selector .submit-wrapper .button {
  background-color: var(--wp--preset--color--black);
  color: var(--wp--preset--color--white);
  font-size: var(--typography--font-size--paragraph-2);
  font-family: var(--wp--custom--font-family--body);
  line-height: var(--typography--line-height--paragraph-2);
  padding: 1.25rem;
  width: 100%;
}

.tsj-subscription-subscription-selector .submit-wrapper .button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .subscription-block-slide-wrapper {
  transform: translateY(2%);
  transition: transform 1200ms ease;
  will-change: transform;
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .subscription-block-opacity-wrapper {
  opacity: 0;
  transition: opacity 800ms ease;
  transition-delay: 200ms;
  will-change: opacity;
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .gift-info-form-transition-wrap {
  opacity: 0;
  transition: opacity 600ms ease;
  transition-delay: 200ms;
  will-change: opacity;
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .subscription-block-slide-wrapper.slide-up-on-load {
  transform: translateY(0);
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .subscription-block-opacity-wrapper.opacity-on-load {
  opacity: 1;
}

body:not(.wp-admin) .tsj-subscription-subscription-selector .gift-info-form-transition-wrap.is-open {
  opacity: 1;
}

@media screen and (min-width: 769px) {
  .tsj-subscription-subscription-selector .text-block {
    max-width: 658px;
    padding: 3.375rem 3rem;
  }

  .tsj-subscription-subscription-selector .subscription-option .title {
    margin-bottom: 1.25rem;
  }

  .tsj-subscription-subscription-selector .subscription-option .image {
    margin-right: 1.25rem;
    max-width: 8.125rem;
  }

  .tsj-subscription-subscription-selector .form-section-title,
  .tsj-subscription-subscription-selector .start-issue-wrapper {
    margin-top: 3.375rem;
  }

  .tsj-subscription-subscription-selector .start-issue-wrapper {
    padding: 2rem;
  }

  .tsj-subscription-subscription-selector .start-issue-wrapper .image {
    margin-right: 1.5rem;
    max-width: 6.1875rem;
  }
}

@media screen and (min-width: 1200px) {
  .tsj-subscription-subscription-selector .text-block {
    max-width: 769px;
    padding: 4.6875rem 4.5rem;
  }
}
