.studio-details {
  .logo {
    margin-bottom: 4rem;
    max-height: 50vh;
    max-width: 100%;
  }
}

.studio-card {
  button.btn.favorite-button {
    padding: 0;
    position: absolute;
    right: 5px;
    top: 10px;

    svg.fa-icon {
      margin-left: 0.4rem;
      margin-right: 0.4rem;
    }
  }

  &:hover button.btn.favorite-button.not-favorite {
    opacity: 1;
  }
}

#studio-page {
  .studio-head {
    .name-icons {
      .not-favorite {
        color: rgba(191, 204, 214, 0.5);
      }

      .favorite {
        color: #ff7373;
      }
    }
  }

  .rating-number .text-input {
    width: auto;
  }

  .quality-group {
    display: inline-flex;
    margin-top: 0.25rem;
  }

  // The following min-width declarations prevent
  // the O-Count from moving around
  // when hovering over rating stars
  .rating-stars-precision-full .star-rating-number {
    min-width: 0.75rem;
  }

  .rating-stars-precision-half .star-rating-number,
  .rating-stars-precision-tenth .star-rating-number {
    min-width: 1.45rem;
  }

  .rating-stars-precision-quarter .star-rating-number {
    min-width: 2rem;
  }

  // the detail element ids are the same as field type name
  // which don't follow the correct convention
  /* stylelint-disable selector-class-pattern */
  .collapsed {
    .detail-item.stash_ids {
      display: none;
    }
  }

  .detail-item.urls ul {
    list-style-type: none;
  }
  /* stylelint-enable selector-class-pattern */
}