/* Audio Player Styles - Optimized for both block and classic editor */

/* Hide default WordPress audio controls for all audio elements */
audio[controls] {
    display: none !important;
}

/* Force center alignment of audio block regardless of editor alignment */
.wp-block-audio,
.wp-audio-shortcode,
.alignleft,
.alignright,
.aligncenter {
    float: none !important;
    margin: 0 auto !important;
    text-align: center !important;
    display: block !important;
    max-width: 100% !important;
}
/* SEO: Hide original audio element but keep it accessible */
.dp-original-audio {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
/* Outer wrapper centers the whole player */
.dp-player-wrap {
    max-width: 720px;
    margin: 18px auto;
    padding: 0 12px;
    box-sizing: border-box;
    position: relative;
}
/* Player box */
.dp-audio-player{
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    background:#fff;
    border-radius:10px;
    box-shadow:0 6px 18px rgba(0,0,0,.12);
    padding:12px 14px;
    display:flex;
    align-items:center;
    gap:14px;
    border:1px solid rgba(0,0,0,0.04);
    justify-content:flex-start;
    box-sizing:border-box;
    overflow:visible;
}
/* Play/Pause button - WHITE with RED background */
.dp-play-btn{
    width:64px;
    height:64px;
    border-radius:50%;
    background:#ff1f5a !important;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    flex:0 0 64px;
    border:none;
    outline:none;
    transition:all .2s ease;
    font-size:26px;
    color:#fff !important;
    font-weight:bold;
    position:relative;
}

/* FIXED: Pure white play icon without blue tint */
.dp-play-btn::before {
    content: "▶";
    display: block;
    color: #ffffff !important;
}

/* Hover state - RED icon with WHITE background */
.dp-play-btn:hover{
    background:#fff !important;
    box-shadow:0 0 0 8px rgba(255,31,90,0.1);
    transform:translateY(-1px);
}
.dp-play-btn:hover::before {
    color:#ff1f5a !important;
}

.dp-play-btn.playing{
    background:#ff1f5a !important;
}
.dp-play-btn.playing::before {
    content: "❚❚";
    color:#fff !important;
}
.dp-play-btn.playing:hover{
    background:#fff !important;
}
.dp-play-btn.playing:hover::before {
    color:#ff1f5a !important;
}
/* Track info */
.dp-track-info{flex:1;min-width:0;margin-left:8px}
.dp-title{font-weight:700;font-size:15px;color:#111;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-meta{display:flex;align-items:center;gap:14px;margin-top:8px}
.dp-time{font-size:12px;color:#666}
/* Progress bar */
.dp-progress{width:100%;height:6px;background:#e6e6e6;border-radius:6px;margin-top:12px;position:relative;overflow:hidden;cursor:pointer}
.dp-progress .dp-bar{position:absolute;left:0;top:0;height:100%;background:#111;width:0;border-radius:6px}
.dp-progress .dp-handle{position:absolute;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid #ff1f5a;box-shadow:0 2px 6px rgba(0,0,0,.18);left:0}
/* Right-side controls */
.dp-controls{display:flex;align-items:center;gap:12px;margin-left:12px;flex:0 0 auto}
.dp-repeat {
    width:36px;height:36px;border-radius:6px;
    display:flex;align-items:center;justify-content:center;
    background:#000;color:#fff;font-size:16px;border:none;cursor:pointer;
    transition:all .2s ease;
}
.dp-repeat:hover {
    background:#333;
}
.dp-repeat.active {
    outline: 3px solid rgba(255,31,90,0.25);
    background:#ff1f5a;
}
/* Volume control */
.dp-vol {
    display:flex;
    align-items:center;
    gap:8px;
    min-width: 120px;
}

/* Volume icon */
.dp-vol-icon {
    width:36px;
    height:36px;
    border-radius:6px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#000;
    color:#fff;
    font-size:16px;
    flex-shrink:0;
    border:none;
    cursor:pointer;
    padding:0;
}

.dp-vol input[type=range]{
    -webkit-appearance:none;
    appearance:none;
    width:80px;
    height:6px;
    background:#e6e6e6;
    border-radius:6px;
    outline:none;
    flex-shrink: 0;
}
.dp-vol input[type=range]::-webkit-slider-thumb{
    -webkit-appearance:none;
    appearance:none;
    width:12px;
    height:12px;
    border-radius:50%;
    background:#ff1f5a;
    border:none;
    box-shadow:0 1px 3px rgba(0,0,0,.2);
    cursor:pointer;
}
.dp-vol input[type=range]::-moz-range-thumb{
    width:12px;
    height:12px;
    border-radius:50%;
    background:#ff1f5a;
    border:none;
    box-shadow:0 1px 3px rgba(0,0,0,.2);
    cursor:pointer;
}
/* Download button - Customizable colors - ULTRA FORCE CENTER inside player wrap */
.dp-player-wrap .dp-download-wrapper {
    width: 100% !important;
    max-width: 720px !important;
    margin: 12px auto !important;
    padding: 0 12px !important;
    text-align: center !important;
    display: block !important;
    float: none !important;
    clear: both !important;
    position: relative !important;
    box-sizing: border-box !important;
    left: 0 !important;
    right: 0 !important;
}
.dp-download-wrapper{
    width:100%;
    text-align:center;
    margin-top:12px;
}
.dp-download{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:12px 22px;
    border-radius:8px;
    text-decoration:none;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:1px;
    box-shadow:0 6px 16px rgba(0,0,0,.18);
    gap:10px;
    white-space:nowrap;
    min-width:200px;
    max-width:280px;
    box-sizing:border-box;
    text-align:center;
    transition:all 0.2s ease;
    margin: 0 auto !important;
    float: none !important;
}
.dp-download:hover{
    text-decoration:none;
    transform:translateY(-1px);
    box-shadow:0 8px 20px rgba(0,0,0,.22);
}
/* Download icon */
.dp-download-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    font-weight:bold;
    width:24px;
    height:24px;
    background:#fff;
    color:#000;
    border-radius:4px;
    line-height:1;
}
/* Download text */
.dp-download-text{
    font-size:14px;
    letter-spacing:0.5px;
}
/* Fixed: Remove duplicate download button styles */
.dp-download-wrapper .dp-download{
    display:inline-flex!important;
}
/* Responsive styles */
@media (max-width:900px){
    .dp-player-wrap{padding:0 8px}
    .dp-audio-player{max-width:100%;padding:10px 12px;gap:10px}
    .dp-play-btn{width:56px;height:56px;font-size:22px;flex:0 0 56px}
    .dp-title{font-size:13px}
    .dp-time{font-size:11px}
    .dp-repeat,.dp-vol-icon{width:32px;height:32px;font-size:14px}
    .dp-vol input[type=range]{width:70px}
    .dp-vol{min-width:110px}
    .dp-controls{gap:8px;margin-left:8px}
    .dp-track-info{margin-left:6px}
    .dp-download{min-width:180px;padding:10px 18px}
    .dp-download-icon{font-size:18px;width:22px;height:22px}
    .dp-download-text{font-size:13px}
}
@media (max-width:600px){
    .dp-audio-player{padding:8px 10px;gap:8px}
    .dp-play-btn{width:60px;height:60px;font-size:20px;flex:0 0 60px}
    .dp-progress .dp-handle{width:10px;height:10px;border:2px solid #ff1f5a}
    .dp-progress{height:5px;margin-top:10px}
    .dp-vol input[type=range]{width:60px;height:5px}
    .dp-vol{min-width:100px;gap:6px}
    .dp-vol input[type=range]::-webkit-slider-thumb{width:10px;height:10px}
    .dp-vol input[type=range]::-moz-range-thumb{width:10px;height:10px}
    .dp-title{font-size:12px}
    .dp-time{font-size:10px}
    .dp-controls{gap:6px;margin-left:6px}
    .dp-repeat,.dp-vol-icon{width:28px;height:28px;font-size:12px}
    .dp-track-info{margin-left:4px}
    .dp-meta{margin-top:6px}
    .dp-download{min-width:160px;padding:8px 16px;gap:8px}
    .dp-download-icon{font-size:16px;width:20px;height:20px}
    .dp-download-text{font-size:12px}
}
@media (max-width:400px){
    .dp-audio-player{padding:8px;gap:6px}
    .dp-play-btn{width:56px;height:56px;font-size:18px;flex:0 0 56px}
    .dp-vol input[type=range]{width:50px}
    .dp-vol{min-width:90px}
    .dp-controls{gap:5px;margin-left:5px}
    .dp-repeat,.dp-vol-icon{width:26px;height:26px;font-size:11px}
    .dp-track-info{margin-left:3px}
    .dp-download{min-width:140px;padding:6px 12px;gap:6px}
    .dp-download-icon{font-size:14px;width:18px;height:18px}
    .dp-download-text{font-size:11px}
}
@media (max-width:360px){
    .dp-audio-player{flex-wrap:nowrap}
    .dp-vol{min-width:80px}
    .dp-vol input[type=range]{width:40px}
    .dp-controls{gap:4px;margin-left:4px}
    .dp-download{min-width:130px;padding:5px 10px}
}