/* ============================================================
   vod-play-missav.css  —  播放頁兩欄重排 (參考 missav 線稿)
   左欄:播放器 → 影片詳情 → 播放列表 → 同分類4×4 → 標籤牆
   右欄:廣告區1 → 廣告區2 → 推薦影片列表
   欄寬沿用既有 .left_row(70%)/.right_row(30%) float。
   整檔刪除 + 移除 <link> + 還原 play.html.bak 即復原。
   ============================================================ */

/* ★ 播放頁去白底:#play_page 原本 background:#f9fafb(白),深色模式沒覆蓋 → 這裡強制深底 */
body.bstem #play_page.mac-play-ms{
    background:#0f0f12 !important;
}
#play_page.mac-play-ms{
    background:#0f0f12;
}

/* 右側推薦列表：放開原本的限高滾動，讓它自然貫穿整欄 */
#play_page.mac-play-ms .play_box_right.mac-play-ms-recommend{
    max-height:none;
    min-height:0;
    overflow:visible;
}

/* 右側廣告位:固定 300×250,置中(對齊 missav) */
#play_page.mac-play-ms .mac-play-ms-ad{
    box-sizing:border-box;
    width:300px;
    max-width:100%;
    margin:0 auto 24px;
}
#play_page.mac-play-ms .mac-play-ms-ad-slot{
    box-sizing:border-box;
    width:300px;
    height:250px;
    max-width:100%;
    overflow:hidden;
    background:#1e1d23;
    border:1px solid #2a2a30;
    border-radius:6px;
    display:flex;
    align-items:center;
    justify-content:center;
}
/* 廣告內 iframe / 圖片鋪滿槽 */
#play_page.mac-play-ms .mac-play-ms-ad-slot iframe,
#play_page.mac-play-ms .mac-play-ms-ad-slot img{
    display:block;
    max-width:100%;
}

/* 右欄推薦區塊間距 */
#play_page.mac-play-ms .mac-play-ms-recommend{ margin-top:4px; }
#play_page.mac-play-ms .mac-play-ms-recommend .play_namebox{ padding:0 0 10px; }
#play_page.mac-play-ms .mac-play-ms-recommend .play_clike{
    color:var(--tpl-text-strong,#f3f4f6); font-size:15px; font-weight:700;
}

/* ===== 推薦列表:橫式縮圖卡(縮圖左 16:9 + 標題右) ===== */
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist{
    margin:0 0 16px;
}
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist > a{
    display:flex;
    gap:12px;
    align-items:flex-start;
}
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist_thumb{
    flex:0 0 150px;
    width:150px;
    height:auto;
    aspect-ratio:16 / 9;
    border-radius:6px;
    background-size:cover;
    background-position:center;
    background-color:#1e1d23;
    box-shadow:0 4px 12px rgba(0,0,0,.4);
}
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist_text{
    flex:1;
    min-width:0;
    padding:0;
}
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist_title p:first-child{
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
    margin:0;
    font-size:13px;
    line-height:1.5;
    color:#cfcfd6;
}
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist:hover .play_vlist_title p:first-child{
    color:var(--tpl-accent,#40cc92);
}
/* 參考站右側卡只顯示標題,隱藏類型/年份/集數 */
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist_tag,
#play_page.mac-play-ms .mac-play-ms-recommend .play_vlist_now{
    display:none;
}

/* ===== 影片詳情 (AV 風) ===== */
#play_page.mac-play-ms .mac-play-ms-detail{ padding:16px 18px; }
#play_page.mac-play-ms .mac-play-ms-detail__head{
    display:flex; align-items:center; gap:12px; margin-bottom:12px;
}
#play_page.mac-play-ms .mac-play-ms-detail__title{
    margin:0; font-size:20px; font-weight:700; line-height:1.4;
    color:var(--tpl-text-strong,#f3f4f6);
}
#play_page.mac-play-ms .mac-play-ms-detail__score{
    flex:0 0 auto; color:#ff4d8d; font-weight:700; font-size:16px;
}
#play_page.mac-play-ms .mac-play-ms-detail__meta{
    list-style:none; margin:0; padding:0;
}
#play_page.mac-play-ms .mac-play-ms-detail__meta li{
    display:flex; gap:10px; padding:6px 0; font-size:14px; line-height:1.6;
    border-bottom:1px solid rgba(255,255,255,.05);
}
#play_page.mac-play-ms .mac-play-ms-detail__meta li:last-child{ border-bottom:0; }
#play_page.mac-play-ms .mac-play-ms-detail__meta .k{
    flex:0 0 64px; color:#8a8a93;
}
#play_page.mac-play-ms .mac-play-ms-detail__meta .v{
    flex:1; min-width:0; color:var(--tpl-text,#ddd); word-break:break-word;
}
#play_page.mac-play-ms .mac-play-ms-detail__meta .v a{ color:inherit; }
#play_page.mac-play-ms .mac-play-ms-detail__meta .v a:hover{ color:var(--tpl-accent,#40cc92); }
#play_page.mac-play-ms .mac-play-ms-detail__desc{
    margin-top:12px; color:#9a9aa3; font-size:13px; line-height:1.75;
}

/* ===== 同分類影片 4×4 網格 (桌機) ===== */
@media screen and (min-width:820px){
    #play_page.mac-play-ms .mac-play-ms-grid4{
        display:grid;
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:16px 12px;
        margin:0;
    }
    #play_page.mac-play-ms .mac-play-ms-grid4 > li,
    #play_page.mac-play-ms .mac-play-ms-grid4 .vodlist_item{
        width:auto !important;
        float:none !important;
        margin:0 !important;
        padding:0 !important;
    }
}
/* 同分類縮圖改 16:9 橫式 */
#play_page.mac-play-ms .mac-play-ms-grid4 .vodlist_thumb{
    aspect-ratio:16 / 9 !important;
    padding-top:0 !important;
    height:auto !important;
    background-size:cover !important;
    background-position:center !important;
}

/* ===== 行動版:兩欄自動堆疊(右欄本就 hidden_xs，主欄轉 100%) ===== */
@media (max-width:820px){
    #play_page.mac-play-ms .mac-play-ms-grid4{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }
    #play_page.mac-play-ms .mac-play-ms-grid4 > li,
    #play_page.mac-play-ms .mac-play-ms-grid4 .vodlist_item{
        width:auto !important; float:none !important; margin:0 !important;
    }
}