/*
 * Author: Audio Player with Playlist
 * Website: https://digitalzoomstudio.net/
 * Portfolio: https://bit.ly/nM4R6u
 * Version: 3.00
 * */

@import "TOKENS";






.meta-artist {
  text-align: left;
}



/* -- functional styling */

$size: 30px;





$color_bg: #464545;
$color_main: #aaaaaa;
$color_main_hover: #dddddd;
$color_highlight: #ae1919;


.audioplayer-tobe {
  opacity: 0;
}
.audioplayer-tobe.for-add {
  display: none;

}


@import "css_player/player";

@import "css_player/player/ap_extraclasses";
@import "css_player/volume";

$color_player_but: #444444;
$color_bg: #eaeaea;
$color_text: #222222;

@import "css_player/player-buttons";
.the-artist {
  &:empty {
    display: none;
  }
}



.audioplayer.meta-loaded, .audioplayer.structure-setuped {

  .meta-artist-con, .prev-btn, .next-btn {

    opacity: 1;
    visibility: visible;
  }
}


.audioplayer.transitioning-change-media {
  overflow: hidden;
}



/* -- SKIN-wave styling */

@import "css_player/player/comments";


.skin-wave.skin-wave-mode-normal {
  .ap-controls {
    .con-controls {
      height: auto;
    }
  }
}


.dzsap-wishlist {
  .audioplayer {
    margin-bottom: 10px;
  }
}



.audioplayer:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

@import "css_player/player/playerErroredOut";


.audioplayer .item-tobe {
  position: relative;
}

.audioplayer .ap-controls .con-controls {
  position: absolute;
}

.audioplayer .ap-controls .con-playpause {
  cursor: pointer;
}


.audioplayer.under-400 .meta-artist-con {
  .the-artist {
    text-overflow: ellipsis;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
  }
}

.audioplayer.under-400:not(.zoomsounds-wrapper-bg-bellow) {
  .controls-volume {
    display: none;
  }
}



.audioplayer.dzsap-loaded {
  .prev-btn, .next-btn, .btn-menu-state, .btn-embed-code {
    visibility: visible;
  }
}

/* -- functional styling END */


/* -- estethic styling */


.dzsap-main-con {
  z-index: 5555;
  position: fixed;
  width: 100%;
  height: 100%;
  opacity: 0;
  top: 0;
  left: 0;
  visibility: hidden;
}




.audioplayer.dzsap-loaded .meta-artist-con {
  visibility: visible;
}





/* -- SKIN-default styling END */


/* -- SKIN-wave styling */

@import 'css_player/player-skins/ap_skin_wave';
@import "css_player/scrubbar/basic_scrub";
@import "css_player/scrubbar/mode_wave";


.dzsap-wishlist {
  .audioplayer {
    margin-bottom: 10px;
  }
}






/* ==========SKIN-wave-mode-small styling END */

@import "css_player/player/ap_skinvariation_wave_bigtitles";






/* -- END SKIN-justthumbandbutton styling */






/* -- SKIN-steel styling ENDD */

@import "css_player/player/ap_extrahtml";










@import "css_player/player/ap_wrappers";





$transition-property: all;
$transition-duration: 0.3s;
$transition-timing: ease-out;








$color_bg: #db4343;
$color_text: #eee;

@import "css_player/player/ap_stick_to_bottom_wrapper";


@import "css_player/player/ap_icons";
@import "css_player/player/external_songChanger";



/*

dzs tooltips

arrow-top,
arrow-bottom
 -- align-left
 -- align-center (js)
 -- align-top

arrow-left,
arrow-right
 -- align-top
 -- align-center (js)
 -- align-bottom


custom css3 effects

*see about custom animation

*/




@import "css_player/player/ap_playlistInner";


.extra-btns-con {

  margin-top: 5px;
}






.icon-svg {
  > svg {
    width: 100%;
    height: 100%;

    path {
      fill: inherit;
    }
  }
}

.buy-con {
  margin-top: 25px;
  text-align: center;
}
@import "css_skins/colors";