/*--------------- Layout adjusments --------------*/
main { flex-flow: row !important; }

.info { max-width: 40vw; }

.jacket,
.controls {
  height: auto;
}
.jacket {
  width: 92%; /* TODO find a less magic number */
  /* create a layer to contain the fixed-positioned ribbon */
  transform: scale(1);
}
.controls {
  position: fixed;
  flex-flow: row;
  align-items: center;
  justify-content: flex-start;
  left: 40vw;
  height: 55px;
  z-index: 2;
  padding-right: 10px;
}

[name=formatSelect] {
  flex-flow: column nowrap;
  align-items: normal;
  text-align: left;
}
[name=formatSelect].interests {text-align: center;}
[name=formatSelect] .price {
  margin: 0;
  text-align: right;
}

/* move toggle button to top-right */
.desc-toggle {
  position: fixed;
  top: 0;
  z-index: 2;
  margin: 10px;
  padding: 5px 0;
  height: 35px;
}
/* making space for the button */
.tracklist-wrapper { margin-top: 55px; }

/*------------------- Buttons -----------------*/
.controls > * {
  margin: 3px;
  padding: 0 5px;
  border-radius: 2px;
  height: 30px;
}
.share.share { margin-right: 20px; }
.ototoy.ototoy, .cart { margin-left: 0; }

/*--------------- Spacing changes -----------*/
.modal-share { padding: 10% 1%; }

.package-info {padding: 0px 15px;}
.package-info p:nth-child(2) { max-width: 100%; }

.text-light { max-width: unset; }

.social-button {
  display: flex;
  align-items: center;
  height: 30px;
}
.social-button > li {
  width: auto;
  flex-shrink: 0;
}
[name=share-embed] {
  width: auto;
  margin-top: 0;
}
[name=iframe-code] {
  position: absolute;
  left: unset;
  right: 22vw;
  width: 50vw;
  z-index: 1;
}

/* ------------------------ playlist specifics -----------------------  */
#playlist .info {
  width: 25%;
  max-width: unset;
  position: relative;
  flex-flow: column;
}

#playlist .package-info { width: 100%; }
#playlist .controls {
  position: relative;
  left: 0;
  width: 100%;
  height: auto;
  margin-top: auto;
  padding: 0 10px;
  flex-flow:inherit;
  justify-content: flex-end;
}

#playlist .controls > * {
  width: 100%;
  padding: 0px 3px;
}

#playlist-desc {
  flex-shrink: 1;
  max-height: calc(100vh - 135px - 50px); /* - (.controls min size) - (title size) */
}

#playlist .share { margin: 15px 3px; }

.format-menu {
  width: 100%;
  margin: 0px;
  height: auto;
}

#playlist .track-entry {
  max-width: calc(100% - 100px);/* minus jacket width */
  margin: 0 0 0 auto;
}

#playlist .tracklist-wrapper {
  margin-top: unset;
  height: 100%;
}

#playlist .package-info {
  padding: 10px 10px;
  min-height: auto;
  flex-shrink: 1;
}

.album-block { min-height: 102px; } /* for single-track entries, jacket height */
.album-entry .album-info {
  min-height: auto;
  height: auto;
}
.album-info > .item:nth-child(2){ margin-left:auto; }