// HACK: overly specific override of _page.scss, will go away in 2.0 redesign's CSS
#podcast {
  main {
    .e-content {
      h1 {
        font: {
          weight: normal;
          size: 2rem;
        }
      }
    }
  }
}

#podcast {
  main {

    .latest-episode {
      margin: (2 * $border-size-xlarge) auto;

      h1 {
        font: {
          weight: normal;
          size: 3rem;
        }

        margin-bottom: $border-size-medium;
      }
    }

    .podcast-meta {
      text-align: right;

      img {
        max-width: 100%;
      }

      .p-name {
        margin-bottom: $border-size-large;
        text-align: left;
      }

      h1 {
        font: {
          weight: bold;
          weight: 800;
          size: 2rem;
        }
        line-height: 1.25em;
      }

      h2 {
        font-size: 1.5rem;
        line-height: 1.5em;
      }

      .podcast-contact-info {
        line-height: 1.25em;
        font-size: 1.2rem;
        margin-top: 1rem;
        margin-bottom: 2rem;
        text-align: left;
        word-break: keep-all;

        i {
          -webkit-hyphens: none;
             -moz-hyphens: none;
                  hyphens: none;
        }

        a {
          text-indent: 0 !important;
          margin: 0;
        }
      }
    }

    .subscribe {
      margin: $border-size-xlarge auto;
      text-align: center;

      a {
        display: inline-block;
        margin: 0 0 $border-size-small $border-size-small;

        // TODO WHY is this necessary? :(
        text-indent: 9999em !important;

        &:first-child {
          margin-left: 0;
        }
      }

      .h-feed {
        article {
          margin-bottom: $border-size-xlarge;
        }

        h1 {
          font-weight: normal;
          font-weight: 700;
          font-size: 2rem;
          margin-bottom: $border-size-medium;
        }

        .e-content {
          margin-bottom: $border-size-large;
        }
      }

      .podcast-subscribe-rss         { @include podcast-subscribe-button("rss"); }
      .podcast-subscribe-itunes      { @include podcast-subscribe-button("itunes"); }
      .podcast-subscribe-overcast    { @include podcast-subscribe-button("overcast"); }
      .podcast-subscribe-pocketcasts { @include podcast-subscribe-button("pocketcasts"); }
    }

    .listen {
      small {
        color: $color-gray-medium;
        font-size: .75em;
      }
    }

    ul, ol {
      list-style-type: disc;
      padding-left: 2.5rem;
      margin-top:  1.5rem;
    }

    ol {
      list-style-type: decimal;
    }

    ul {
      list-style-type: square;
    }

    @media screen and (min-width: $small-tablet) {
      .subscribe {
        margin: $border-size-small auto;
        text-align: right;

        a {
          margin: 0 0 $border-size-small $border-size-small;
          // WHY is this necessary? :(
          text-indent: 9999em !important;
        }
      }

      .latest-episode {
        margin-top: 0;
      }

      .meta {
        .p-name {
          text-align: right;
        }

        .podcast-contact-info {
          text-align: right;
        }
      }
    }

  }
}
