/*/// Button ///*/
.ba__media-button{display: flex; align-items: center; justify-content: center;}
.ba__media-button button{border:0;margin:0;overflow:hidden;padding:0;cursor:pointer;display:inline-flex; align-items: center; justify-content: center; height:1.5em;width:1.5em;background: none;text-decoration:none; font-size: 16px; color: inherit; position: relative;}
.ba__media-button>button:focus{outline:0}
.ba__media-button button::before,
.ba__media-button button::after,
.ba__media-overlay-button::before{content: '';display:table;box-sizing: border-box;width:0; height:0;border:0 solid transparent; color: inherit;}
/*
[class*="ba__media-button"]>button::before, .ba__media-overlay-button::before{content: ''; font-family: "Font Awesome 5 Free"; font-weight: 900;}
.ba__media-play>button::before{content: '\f04b'; color: #f90; color: var(--ba-audio-primary, #f90);}
.ba__media-pause>button::before{content: '\f04c'; color: #f90; color: var(--ba-audio-primary, #f90);}
.ba__media-replay>button::before{content: '\f01e';}
.ba__media-fullscreen-button>button::before{content: '\f065';}
.ba__media-unfullscreen>button::before{content: '\f066';}
.ba__media-mute>button::before{content: '\f028';}
.ba__media-unmute>button::before{content: '\f6a9';}
.ba__media-captions-button>button{content: '\f20a';}
.ba__media-chapters-button>button{content: '\f20a';}
.ba__media-overlay-button::before{content: '\f144'; font-size: 3em;}
.ba__media-prevtrack button::before {content: '\f048';}
.ba__media-nexttrack button::before {content: '\f051';}
.ba__media-looptrack button::before {content: '\f079';}
.ba__media-playlisttrack button::before {content: '\f0ca';}
.ba__media-shuffletrack button::before {content: '\f074';}
.ba__media-loop-on button::before,
.ba__media-shuffle-on button::before,
.ba__media-playlist-on button::before{color: #f90; color: var(--ba-audio-primary, #f90);}
.ba__media-loop-off button::before{color: #fff;}
*/

.ba__media-overlay-button::before{border-width: .5em 0 .5em .75em;border-left-color:currentColor; font-size:2.5em;}
.ba__media-play button::before{border-width: .5em 0 .5em .75em;border-left-color:currentColor; color: #f90; color: var(--ba-audio-primary, #f90);}
.ba__media-pause button::before{width:.75em; height: 1em; border-width: 0 .3em; border-color: transparent currentColor; color: #f90; color: var(--ba-audio-primary, #f90);}
.ba__media-prevtrack button::before{border-width: .5em .5em .5em 0;border-right-color:currentColor;box-shadow: -.125em 0 0;}
.ba__media-nexttrack button::before{border-width: .5em 0 .5em .5em;border-left-color:currentColor;box-shadow: .125em 0 0;}
.ba__media-captions-button>button::before{width:1em; height:.6em; border: 2px solid currentColor; content: 'cc';line-height: 1;font-size: .8em;}
.ba__media-chapters-button>button::before{width:1em;height:.8em;border-left: 4px solid transparent;border-right: 4px solid transparent;box-shadow: 0 0 0 2px,inset 2px 0 0,inset -2px 0 0;}


.ba__media-fullscreen-button>button::before,
.ba__media-unfullscreen>button::before,
.ba__media-mute button::before,
.ba__media-unmute button::before,
.ba__media-looptrack button::before,
.ba__media-playlisttrack button::before,
.ba__media-shuffletrack button::before,
.ba__media-replay>button::before,
.fa-sort-alpha-down::before,
.demo-content .fa-download::before,
.demo-content .fa-shopping-basket::before{
  content: '';
  display: inline-block;
  -webkit-mask: var(--ba-un-icon) center center no-repeat;
  mask: var(--ba-un-icon) center center no-repeat;
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  background-color: currentColor;
  color: inherit;
  width:1.2em;
  height:1.2em;  
}

.ba__media-looptrack button::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M6 4h15a1 1 0 0 1 1 1v7h-2V6H6v3L1 5l5-4v3Zm12 16H3a1 1 0 0 1-1-1v-7h2v6h14v-3l5 4l-5 4v-3Z'/%3E%3C/svg%3E");  
}
.ba__media-playlisttrack button::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M2 18h10v2H2v-2Zm0-7h14v2H2v-2Zm0-7h20v2H2V4Zm17 11.17V9h5v2h-3v7a3 3 0 1 1-2-2.83Z'/%3E%3C/svg%3E");
}
.ba__media-shuffletrack button::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M18 17.883V16l5 3l-5 3v-2.09a9 9 0 0 1-6.997-5.365L11 14.54l-.003.006A9 9 0 0 1 2.725 20H2v-2h.725a7 7 0 0 0 6.434-4.243L9.912 12l-.753-1.757A7 7 0 0 0 2.725 6H2V4h.725a9 9 0 0 1 8.272 5.455L11 9.46l.003-.006A9 9 0 0 1 18 4.09V2l5 3l-5 3V6.117a7 7 0 0 0-5.159 4.126L12.088 12l.753 1.757A7 7 0 0 0 18 17.883Z'/%3E%3C/svg%3E");
}
.ba__media-replay>button::before {
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='m7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8V1L7 6z'/%3E%3C/svg%3E");
}
.ba__media-mute button::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M5.889 16H2a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h3.889l5.294-4.332a.5.5 0 0 1 .817.387v15.89a.5.5 0 0 1-.817.387L5.89 16Zm13.517 4.134l-1.416-1.416A8.977 8.977 0 0 0 21 12a8.982 8.982 0 0 0-3.304-6.968l1.42-1.42A10.976 10.976 0 0 1 23 12c0 3.223-1.386 6.122-3.594 8.134Zm-3.543-3.543l-1.422-1.422A3.994 3.994 0 0 0 16 12c0-1.43-.75-2.685-1.88-3.392l1.439-1.439A5.991 5.991 0 0 1 18 12c0 1.842-.83 3.49-2.137 4.591Z'/%3E%3C/svg%3E");
}
.ba__media-unmute button::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M5.889 16H2a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h3.889l5.294-4.332a.5.5 0 0 1 .817.387v15.89a.5.5 0 0 1-.817.387L5.89 16Zm14.525-4l3.536 3.536l-1.415 1.414L19 13.414l-3.536 3.536l-1.414-1.414L17.586 12L14.05 8.465l1.414-1.415L19 10.586l3.535-3.536l1.415 1.415L20.414 12Z'/%3E%3C/svg%3E");
}
.ba__media-fullscreen-button>button::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M16 3h6v6h-2V5h-4V3ZM2 3h6v2H4v4H2V3Zm18 16v-4h2v6h-6v-2h4ZM4 19h4v2H2v-6h2v4Z'/%3E%3C/svg%3E");
}
.ba__media-unfullscreen>button::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M18 7h4v2h-6V3h2v4ZM8 9H2V7h4V3h2v6Zm10 8v4h-2v-6h6v2h-4ZM8 15v6H6v-4H2v-2h6Z'/%3E%3C/svg%3E");
}

.fa-sort-alpha-down::before{
  --ba-un-icon: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" viewBox="0 0 24 24"%3E%3Cpath fill="none" stroke="currentColor" stroke-width="2" d="M15 10V5c0-1.38.62-2 2-2s2 .62 2 2v5m0-3h-4m4 14h-4l4-7h-4M4 15l3 3l3-3M7 6v12"%2F%3E%3C%2Fsvg%3E');
}
.demo-content .fa-download::before{
  --ba-un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M19.35 10.04A7.49 7.49 0 0 0 12 4C9.11 4 6.6 5.64 5.35 8.04A5.994 5.994 0 0 0 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5c0-2.64-2.05-4.78-4.65-4.96zM17 13l-4.65 4.65c-.2.2-.51.2-.71 0L7 13h3V9h4v4h3z'/%3E%3C/svg%3E");
}
.demo-content .fa-shopping-basket::before{
  --ba-un-icon: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="576" height="512" viewBox="0 0 576 512"%3E%3Cpath fill="currentColor" d="M576 216v16c0 13.255-10.745 24-24 24h-8l-26.113 182.788C514.509 462.435 494.257 480 470.37 480H105.63c-23.887 0-44.139-17.565-47.518-41.212L32 256h-8c-13.255 0-24-10.745-24-24v-16c0-13.255 10.745-24 24-24h67.341l106.78-146.821c10.395-14.292 30.407-17.453 44.701-7.058c14.293 10.395 17.453 30.408 7.058 44.701L170.477 192h235.046L326.12 82.821c-10.395-14.292-7.234-34.306 7.059-44.701c14.291-10.395 34.306-7.235 44.701 7.058L484.659 192H552c13.255 0 24 10.745 24 24zM312 392V280c0-13.255-10.745-24-24-24s-24 10.745-24 24v112c0 13.255 10.745 24 24 24s24-10.745 24-24zm112 0V280c0-13.255-10.745-24-24-24s-24 10.745-24 24v112c0 13.255 10.745 24 24 24s24-10.745 24-24zm-224 0V280c0-13.255-10.745-24-24-24s-24 10.745-24 24v112c0 13.255 10.745 24 24 24s24-10.745 24-24z"%2F%3E%3C%2Fsvg%3E');
}

.ba__media-loop-on button,
.ba__media-loop-on button::before,
.ba__media-loop-on button::after,
.ba__media-shuffle-on button::before,
.ba__media-playlist-on button::before,
.ba__media-playlist-on button::after{color: #f90; color: var(--ba-audio-primary, #f90) !important;}
.ba__media-loop-off button::before,
.ba__media-loop-off button::after{color: #fff;}


.ba__media-looptrack[data-loop-one] button::after{content:'1';position:absolute;width:1em;height:1em;text-align:center;display:block;left:50%;top:50%;font-size:.5em;font-weight:700;background:#68698e;line-height:1;padding:.1em;border-radius:.2em;box-shadow:0 0 .2em #fff;color:#fff !important}
.ba__media-covertrack{max-width: 30%;}
.ba__media-texttrack, .ba__media-playlist .title{font-weight: bold;}
.ba__media-texttrack i, .ba__media-playlist .title i{font-weight: normal; opacity: .7; display: block;}
.ba__media-playlist .title i{display: inline-block;}
.ba__media-playlist .title i::before{content: ' - '; display: inline-block; padding: 0 .5em;}
.ba__media-time-current{background: #f90; background: var(--ba-audio-primary, #f90);}