/**
** FIGURE LICENSE
** Popup displaying license info
**
**  PRINCIPLE:
**
**/

.c-figure-license {
  @include font-size(16px);
  font-family: $font-serif;
}

.c-figure-license__cta-block {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-self: flex-end;

  > * {
    margin-top: $spacing--small;
  }

  @include mq(tablet) {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.c-figure-license__button {
  margin-bottom: $spacing--small;
}

.c-figure-license__link {
  color: $brand-color;
}

.c-figure-license__list {
  background: $white;
  list-style: none;
  padding: 0 $spacing--small $spacing--small $spacing--small;
  margin-top: 0;
  margin-bottom: 0;
  li {
    list-style: none;
  }
}

.c-figure-license__item {
  margin-bottom: 0;
}

.c-figure-license__close {
  position: absolute;
  top: $spacing;
  right: $spacing;
  background: transparent;
  border: none;
  color: $brand-color;
  @include font-size(20px);
  font-weight: $font-weight-normal;
  z-index: 9;
  cursor: pointer;
}

.c-figure-license__cta-wrapper {
  background-color: $white;
  padding: $spacing;
  margin-top: $spacing;
}

.c-figure-license__title {
  margin: 0 0 $spacing--small;
  @include inuit-font-size(18px);
  color: $brand-color;
}
.c-figure-license--fullscreen {
  text-align: center;
}
.c-figure-license__content {
  margin: auto;
  display: inline-block;
  text-align: left;
}

.c-figure-license__image-title {
  @include inuit-font-size(28px);
  margin: $spacing 0 0;
  text-align: left;
}

.c-figure-license__hidden-content {
  display: none;
  flex-wrap: wrap;
  > div {
    width: 48%;
    margin: 1%;
  }
}
.c-figure-license__hidden-content--active {
  display: flex;
}

.c-figure-license__image-wrapper {
  display: block;
  cursor: zoom-in;
  margin: 0 auto;
  padding: 0;
  background: none;
  border: 0;
  overflow: hidden;
  margin-top: $spacing--large;

  img {
    transition: transform 0.5s ease-out;
    max-width: 100%;
    max-height: 90vh;
    height: auto;
    margin: auto;
  }

  &--zoom {
    cursor: zoom-out;

    img {
      transform: scale3d(2, 2, 2);
    }
  }
}