﻿/* 由详情页内联样式抽取，供 article_*.htm 公共引用，升级不影响后端 */
.item-content {
                margin-bottom: 20px;
            }
            .item-title-container {
                margin: 20px auto;
                text-align: center;
            }
            .item-date-container {
                margin: 20px auto;
                text-align: center;
            }
            /* 核心改动1：为图片容器增加相对定位，以便播放按钮精准居中 */
            .item-img-container {
                position: relative;
                margin: 20px auto;
                width: 90%;
                border-radius: 10px;
                padding: 10px;
                cursor: pointer;
            }
            .item-img {
                width: 100%;
                height: auto;
                display: block;
                border-radius: 6px;
            }
            /* 核心改动2：纯 CSS 打造完美契合截图的高清播放按钮 */
            .play-btn-overlay {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: 68px;
                height: 68px;
                background: rgba(0, 0, 0, 0.25);
                /* 淡淡的黑色半透明底色 */
                border: 3px solid #ffffff;
                /* 纯白外边框 */
                border-radius: 50%;
                /* 完美圆形 */
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.3s ease;
                /* 增加鼠标悬停过渡动画 */
                box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
            }
            /* 播放按钮内部的纯白实体三角形 */
            .play-btn-overlay::after {
                content: "";
                width: 0;
                height: 0;
                border-style: solid;
                border-width: 13px 0 13px 22px;
                border-color: transparent transparent transparent #ffffff;
                margin-left: 7px;
                /* 微调三角位置，使其在视觉上完美居中 */
            }
            /* 鼠标滑过容器时的微互动特效应 */
            .item-img-container:hover .play-btn-overlay {
                background: rgba(0, 0, 0, 0.45);
                transform: translate(-50%, -50%) scale(1.08);
                /* 微微放大 */
            }
            .item-desc-container {
                padding: 10px;
                line-height: 30px;
            }
            .item-info-container {
                margin-top: 20px;
            }

/* 播放器大盒子 */
                                    .video-player-mock-container {
                                        position: relative;
                                        width: 100%;
                                        max-width: 850px;
                                        aspect-ratio: 16 / 9;
                                        /* 完美维持16:9黄金视频比例 */
                                        margin: 0 auto;
                                        /* 优先使用你原本就有的球场背景大图，如果没有，则降级为暗黑质感底色 */
                                        background: url('static/images/livebg.jpg') no-repeat center center;
                                        background-size: cover;
                                        border-radius: 16px;
                                        overflow: hidden;
                                        color: #ffffff;
                                        font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
                                        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
                                    }
                                    /* 顶部信息行 */
                                    .player-top-meta {
                                        position: absolute;
                                        top: 18px;
                                        left: 24px;
                                        font-size: 18px;
                                        font-weight: 600;
                                        letter-spacing: 0.5px;
                                        color: rgba(255, 255, 255, 0.95);
                                        text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.85);
                                    }
                                    /* 中央对阵大面板 */
                                    .player-match-scoreboard {
                                        position: absolute;
                                        top: 50%;
                                        left: 50%;
                                        transform: translate(-50%, -50%);
                                        display: flex;
                                        align-items: center;
                                        justify-content: space-between;
                                        width: 85%;
                                    }
                                    /* 单个球队包裹盒 */
                                    .scoreboard-team-box {
                                        display: flex;
                                        flex-direction: column;
                                        align-items: center;
                                        width: 35%;
                                        text-align: center;
                                    }
                                    .team-logo-img {
                                        width: 80px;
                                        height: 80px;
                                        object-fit: contain;
                                        filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.4));
                                    }
                                    .team-name-text {
                                        margin-top: 15px;
                                        font-size: 20px;
                                        font-weight: bold;
                                        text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.9);
                                        letter-spacing: 0.5px;
                                    }
                                    /* 中间比分与直播状态区 */
                                    .scoreboard-center-status {
                                        display: flex;
                                        flex-direction: column;
                                        align-items: center;
                                        justify-content: center;
                                        width: 30%;
                                    }
                                    .status-live-tag {
                                        font-size: 24px;
                                        font-weight: bold;
                                        letter-spacing: 4px;
                                        margin-bottom: 12px;
                                        text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.9);
                                    }
                                    .status-score-num {
                                        font-size: 42px;
                                        font-weight: 900;
                                        letter-spacing: 1px;
                                        text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.95);
                                    }
                                    /* 底部虚拟控制条 */
                                    .player-bottom-control-bar {
                                        position: absolute;
                                        bottom: 20px;
                                        left: 24px;
                                        right: 24px;
                                        display: flex;
                                        align-items: center;
                                        gap: 15px;
                                    }
                                    /* 迷你白框播放按钮 */
                                    .mock-play-icon {
                                        width: 24px;
                                        height: 24px;
                                        border: 2px solid rgba(255, 255, 255, 0.7);
                                        border-radius: 50%;
                                        display: flex;
                                        align-items: center;
                                        justify-content: center;
                                        flex-shrink: 0;
                                    }
                                    .mock-play-icon::after {
                                        content: "";
                                        width: 0;
                                        height: 0;
                                        border-style: solid;
                                        border-width: 5px 0 5px 8px;
                                        border-color: transparent transparent transparent rgba(255, 255, 255, 0.8);
                                        margin-left: 2px;
                                    }
                                    /* 视频灰色进度条线 */
                                    .mock-progress-line {
                                        flex: 1;
                                        height: 4px;
                                        background: rgba(255, 255, 255, 0.35);
                                        border-radius: 2px;
                                    }
                                    /* 下方按钮整合区域 */
                                    .live-signal-action-buttons {
                                        margin: 30px auto 10px;
                                        display: flex;
                                        justify-content: center;
                                        align-items: center;
                                        gap: 24px;
                                    }
                                    /* 独家定制红高光立体按钮 */
                                    .signal-btn-red {
                                        display: inline-block;
                                        padding: 12px 36px;
                                        background: #007aff;
                                        color: #ffffff !important;
                                        font-size: 16px;
                                        font-weight: bold;
                                        text-decoration: none !important;
                                        border-radius: 8px;
                                        box-shadow: 0 4px 14px rgba(255, 34, 34, 0.4);
                                        transition: all 0.2s ease-in-out;
                                    }
                                    .signal-btn-red:hover {
                                        background: #007aff;
                                        transform: translateY(-2px);
                                        box-shadow: 0 6px 18px rgba(255, 34, 34, 0.5);
                                    }
                                    .signal-btn-red:active {
                                        transform: translateY(0);
                                    }
                                    /* 适配移动端小屏幕，自动等比缩放字体与图片大小，防止挤压爆框 */
                                    @media (max-width: 600px) {
                                        .player-top-meta {
                                            font-size: 13px;
                                            top: 10px;
                                            left: 12px;
                                        }
                                        .team-logo-img {
                                            width: 45px;
                                            height: 45px;
                                        }
                                        .team-name-text {
                                            font-size: 13px;
                                            margin-top: 8px;
                                        }
                                        .status-live-tag {
                                            font-size: 15px;
                                            margin-bottom: 4px;
                                            letter-spacing: 1px;
                                        }
                                        .status-score-num {
                                            font-size: 26px;
                                        }
                                        .player-bottom-control-bar {
                                            bottom: 10px;
                                            left: 12px;
                                            right: 12px;
                                        }
                                        .signal-btn-red {
                                            padding: 10px 20px;
                                            font-size: 14px;
                                        }
                                        .live-signal-action-buttons {
                                            gap: 12px;
                                        }
                                    }
