/* ===== APlayer 音乐播放器 · 左下角悬浮 =====
   注意：APlayer 的 fixed 模式是给「底部通栏」设计的，
   .aplayer-body 自带 position:fixed + left:0 + right:0，独立于父容器定位，
   因此必须直接覆写 .aplayer-body，只改父容器是无效的。 */

/* --- 播放体：真正的定位目标 --- */
body .aplayer.aplayer-fixed .aplayer-body {
    position: fixed !important;
    left: 18px !important;
    right: auto !important;
    bottom: 18px !important;
    top: auto !important;
    margin: 0 !important;
    width: 360px !important;
    max-width: calc(100vw - 36px) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 6px 26px rgba(240, 98, 146, .32) !important;
    overflow: hidden !important;
    z-index: 9998 !important;
    backdrop-filter: blur(10px);
}

/* --- 列表：贴在播放体上方，对齐同样的左边距 --- */
body .aplayer.aplayer-fixed .aplayer-list {
    position: fixed !important;
    left: 18px !important;
    right: auto !important;
    bottom: 80px !important;
    margin: 0 0 8px 0 !important;
    width: 360px !important;
    max-width: calc(100vw - 36px) !important;
    border-radius: 14px !important;
    border: 1px solid #f3e3ea !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 8px 26px rgba(240, 98, 146, .22) !important;
    overflow: hidden auto !important;
    z-index: 9997 !important;
}

/* 收起态：缩成圆钮，贴左下角
   注意：APlayer 在 mini 模式下会先渲染 narrow 态，点击展开才移除该 class。
   因此这里只隐藏「音乐信息」文字，绝不能用 display:none 干掉 .aplayer-info，
   否则展开后会看不到歌名。 */
body .aplayer.aplayer-fixed.aplayer-narrow .aplayer-body {
    width: 60px !important;
    border-radius: 30px !important;
}

body .aplayer.aplayer-fixed.aplayer-narrow .aplayer-body .aplayer-music,
body .aplayer.aplayer-fixed.aplayer-narrow .aplayer-body .aplayer-controller {
    opacity: 0 !important;
    pointer-events: none !important;
}

/* 展开态：确保信息完整可见 */
body .aplayer.aplayer-fixed:not(.aplayer-narrow) .aplayer-body .aplayer-info {
    display: block !important;
    opacity: 1 !important;
}

body .aplayer.aplayer-fixed:not(.aplayer-narrow) .aplayer-body .aplayer-music,
body .aplayer.aplayer-fixed:not(.aplayer-narrow) .aplayer-body .aplayer-controller {
    display: block !important;
    opacity: 1 !important;
}

body .aplayer.aplayer-fixed:not(.aplayer-narrow) .aplayer-body .aplayer-controller {
    display: flex !important;
}

/* ================= 可读性优化 =================
   APlayer 默认样式偏纤细：进度条仅 2px、拖动圆点宽度 0、
   时间 11px/#999，在手机屏幕上几乎不可辨。这里统一加粗加深。 */

/* --- 歌名 / 歌手：加大、加粗、加深 ---
   .aplayer-music 默认 max-width 仅 calc(100% - 105px)，
   字号调大后歌名会把歌手挤掉，这里放宽容器并做单行省略 */
body .aplayer.aplayer-fixed .aplayer-music {
    max-width: none !important;
    width: auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding-right: 6px !important;
}

body .aplayer.aplayer-fixed .aplayer-title {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #2b2b2b !important;
    line-height: 1.4 !important;
    max-width: 165px !important;
    display: inline-block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: bottom !important;
}

body .aplayer.aplayer-fixed .aplayer-author {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #5a5a5a !important;
    line-height: 1.4 !important;
    vertical-align: bottom !important;
}

/* --- 时间：从 11px/#999 提到 12px/#666 --- */
body .aplayer.aplayer-fixed .aplayer-time,
body .aplayer.aplayer-fixed .aplayer-time * {
    font-size: 12px !important;
}

body .aplayer.aplayer-fixed .aplayer-icon-back,
body .aplayer.aplayer-fixed .aplayer-icon-play,
body .aplayer.aplayer-fixed .aplayer-icon-forward,
body .aplayer.aplayer-fixed .aplayer-icon-loop,
body .aplayer.aplayer-fixed .aplayer-icon-menu,
body .aplayer.aplayer-fixed .aplayer-icon-lrc {
    color: #6b6b6b !important;
}

/* 时间整体加深 */
body .aplayer.aplayer-fixed .aplayer-time {
    color: #6b6b6b !important;
    position: absolute;
    right: 0;
    top: -1px;
}

/* --- 进度条：2px → 5px，并做出层次 ---
   bar-wrap 的内边距与左右留白统一在下方 thumb 段落里定义，此处不再重复。 */

body .aplayer.aplayer-fixed .aplayer-bar {
    height: 5px !important;
    border-radius: 4px !important;
    background: #e6e6e6 !important;
}

/* 缓冲进度：浅粉灰，与轨道明显区分 */
body .aplayer.aplayer-fixed .aplayer-loaded {
    height: 5px !important;
    border-radius: 4px !important;
    background: #d3d3d3 !important;
}

/* 已播放：粉色调，与站点主色统一 */
body .aplayer.aplayer-fixed .aplayer-played {
    height: 5px !important;
    border-radius: 4px !important;
    background: linear-gradient(90deg, #f8bbd0, #f06292) !important;
}

/* 拖动圆点：APlayer 默认是 0 尺寸（仅 hover 轨道时才出现），
   这里显式给尺寸并常驻显示。
   注意：不能用 translate(-50%) —— 进度为 0 时圆点会越过轨道左端溢出到封面上，
   改用 APlayer 自身的 margin 方式定位。 */
body .aplayer.aplayer-fixed .aplayer-thumb {
    display: block !important;
    position: absolute !important;
    top: 50% !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    margin-top: -7px !important;
    margin-left: -6px !important;
    transform: none !important;
    background: #f06292 !important;
    border: 2px solid #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 1px 5px rgba(240, 98, 146, .6) !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-sizing: content-box !important;
}

/* hover 时略微放大，方便拖动 */
body .aplayer.aplayer-fixed .aplayer-bar-wrap:hover .aplayer-thumb {
    width: 17px !important;
    height: 17px !important;
    min-width: 17px !important;
    min-height: 17px !important;
    margin-top: -8.5px !important;
    margin-left: -7.5px !important;
}

/* 进度条轨道留出左右空间，避免圆点在两端被裁切 */
body .aplayer.aplayer-fixed .aplayer-bar-wrap {
    padding: 5px 8px 5px 0 !important;
    margin-right: 4px !important;
}

/* 播放/暂停按钮加深对比 */
body .aplayer.aplayer-fixed .aplayer-button path {
    fill: #ffffff !important;
}

body .aplayer.aplayer-fixed .aplayer-pic {
    border-radius: 13px 0 0 13px !important;
    box-shadow: 2px 0 8px rgba(0, 0, 0, .08);
}

/* 迷你切换按钮（收起/展开）跟随播放体 */
body .aplayer.aplayer-fixed .aplayer-miniswitcher {
    right: -1px !important;
    border-radius: 14px !important;
}

/* 歌词区不要干扰 */
body .aplayer.aplayer-fixed .aplayer-lrc {
    display: none !important;
}

/* --- 移动端：宽度自适应并留边距 --- */
@media (max-width: 768px) {
    body .aplayer.aplayer-fixed .aplayer-body {
        left: 10px !important;
        right: 10px !important;
        bottom: 10px !important;
        width: auto !important;
        max-width: none !important;
    }
    body .aplayer.aplayer-fixed .aplayer-list {
        left: 10px !important;
        right: 10px !important;
        bottom: 76px !important;
        width: auto !important;
        max-width: none !important;
    }
    body .aplayer.aplayer-fixed.aplayer-narrow .aplayer-body {
        right: auto !important;
        width: 56px !important;
    }

    /* 小屏下歌名与右侧控制键容易贴太紧。
       取舍：优先保证「歌名」完整可读（用户主要看歌名），
       歌手在极窄屏允许省略号收缩。 */
    body .aplayer.aplayer-fixed .aplayer-title {
        font-size: 14px !important;
        max-width: 168px !important;
    }
    body .aplayer.aplayer-fixed .aplayer-author {
        font-size: 12px !important;
        max-width: 72px !important;
        display: inline-block !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    body .aplayer.aplayer-fixed .aplayer-music {
        padding-right: 8px !important;
    }
    /* 小屏下缩小时间字号，把宽度让给歌名 */
    body .aplayer.aplayer-fixed .aplayer-time {
        font-size: 11px !important;
    }
}
