/* Audio slider widget styles — tuned to match provided screenshot */
.sj-audio-slider{display:block;width:100%}
.sj-audio-slider .slick-list{margin:0}
.sj-audio-slider .slick-track{display:flex}
.sj-slide{display:flex;flex-direction:column;gap:16px}
.sj-row{display:flex;gap:16px}
.sj-audio-item{flex:1;padding:8px}
.sj-audio-card{display:flex;align-items:center;background:#ffffff;border-radius:8px;padding:18px;box-shadow:0 6px 18px rgba(16,24,40,0.06);border:1px solid rgba(16,24,40,0.04)}
.sj-play{width:64px;height:64px;border-radius:50%;background:#e9e9eb;border:0;display:flex;align-items:center;justify-content:center;margin-right:18px;cursor:pointer;flex:0 0 64px}
.sj-play .sj-play-icon{font-size:20px;color:#6b6b72}
.sj-play.paused{background:#c79b3f;color:#fff}
.sj-audio-content{flex:1;min-width:0}
.sj-title{font-weight:700;margin-bottom:8px;color:#222;font-size:16px}
.sj-times{font-size:12px;color:#9aa0a6;display:flex;justify-content:space-between;margin-bottom:8px}
.sj-times .sj-current{margin-right:auto}
.sj-progress{height:8px;background:#eef0f3;border-radius:6px;overflow:hidden}
.sj-progress-bar{height:100%;width:0;background:#c79b3f}
.sj-audio-card.playing{box-shadow:0 8px 24px rgba(16,24,40,0.08)}

/* Responsive spacing for slick slides */
.sj-audio-slider .slick-slide{padding:8px}

/* Arrows appearance to match screenshot */
.sj-audio-slider .slick-prev,
.sj-audio-slider .slick-next{width:40px;height:40px;border-radius:6px;background:#c79b3f;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:none;border:0}
.sj-audio-slider .slick-prev:hover,
.sj-audio-slider .slick-next:hover{opacity:0.95}
.sj-audio-slider .slick-prev:before,
.sj-audio-slider .slick-next:before{content:'';display:none}

/* Arrows outside styling */
.sj-arrows-outside.slick-slider{padding-left:48px;padding-right:48px}
.sj-arrows-outside .slick-prev{left:12px}
.sj-arrows-outside .slick-next{right:12px}

/* Arrows top styling */
.sj-arrows-top{position:relative}
.sj-arrows-top .slick-prev{left:50%;transform:translateX(-100%);top:-50px}
.sj-arrows-top .slick-next{right:50%;transform:translateX(100%);top:-50px}

/* Arrows bottom styling */
.sj-arrows-bottom{position:relative}
.sj-arrows-bottom .slick-prev{left:50%;transform:translateX(-100%);bottom:-50px}
.sj-arrows-bottom .slick-next{right:50%;transform:translateX(100%);bottom:-50px}

/* Arrows left styling */
.sj-arrows-left{position:relative}
.sj-arrows-left .slick-prev{left:-50px;top:50%;transform:translateY(-50%)}
.sj-arrows-left .slick-next{left:-50px;top:50%;transform:translateY(50%)}

/* Arrows right styling */
.sj-arrows-right{position:relative}
.sj-arrows-right .slick-prev{right:-50px;top:50%;transform:translateY(-50%)}
.sj-arrows-right .slick-next{right:-50px;top:50%;transform:translateY(50%)}

/* Arrows top-left styling */
.sj-arrows-top-left{position:relative}
.sj-arrows-top-left .slick-prev{left:20px;top:-50px}
.sj-arrows-top-left .slick-next{left:60px;top:-50px}

/* Arrows top-right styling */
.sj-arrows-top-right{position:relative}
.sj-arrows-top-right .slick-prev{right:60px;top:-60px; left: unset;}
.sj-arrows-top-right .slick-next{right:0;top:-60px}

/* Arrows bottom-left styling */
.sj-arrows-bottom-left{position:relative}
.sj-arrows-bottom-left .slick-prev{left:20px;bottom:-50px}
.sj-arrows-bottom-left .slick-next{left:60px;bottom:-50px}

/* Arrows bottom-right styling */
.sj-arrows-bottom-right{position:relative}
.sj-arrows-bottom-right .slick-prev{right:60px;bottom:-50px}
.sj-arrows-bottom-right .slick-next{right:20px;bottom:-50px}

/* Arrows custom styling */
.sj-arrows-custom{position:relative}
.sj-arrows-custom .slick-prev{left:calc(50% + var(--arrow-offset-x, 0px));top:calc(50% + var(--arrow-offset-y, 0px));transform:translate(-50%, -50%)}
.sj-arrows-custom .slick-next{right:calc(50% - var(--arrow-offset-x, 0px));top:calc(50% + var(--arrow-offset-y, 0px));transform:translate(50%, -50%)}

/* Small adjustments for small screens */
@media (max-width:767px){
	.sj-play{width:40px;height:40px;flex:0 0 40px;margin-right:12px; padding: 6px;}
	.sj-title {
    font-size: 12px;
    line-height: 14px;
}
.sj-audio-card {
    padding: 10px;
}
.sj-row {
    gap: 0;
}
.sj-arrows-top-right .slick-next {
    top: -40px;
}
.sj-arrows-top-right .slick-prev {
    top: -40px;
}
}
/* Arrows outside styling */
.sj-arrows-outside.slick-slider{padding-left:40px;padding-right:40px}
.sj-arrows-outside .slick-prev{left:8px}
.sj-arrows-outside .slick-next{right:8px}
.slick-next:focus, .slick-next:hover, .slick-prev:focus, .slick-prev:hover{
	background: #c79b3f !important;
}