/* ============================================
   直播间现代化视觉皮肤（仅覆盖颜色/表面/字体/反馈）
   不修改 float/width/position 等布局属性，保留全部 JS 钩子
   加载顺序：置于原 show.css 之后
   ============================================ */

/* --- 全局暗色基调 --- */
body {
    background: #0b0b14 !important;
    color: var(--text-primary, #f1f5f9);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', sans-serif;
}

/* --- 舞台（宽度/内边距由 JS 动态计算，不可覆盖） --- */
.SR-stager {
    max-width: 96vw;
}

/* --- 视频区 --- */
.SR-area-video {
    border-radius: 16px 0 0 16px;
    overflow: hidden;
    box-shadow: 0 8px 40px rgba(0,0,0,0.6);
}
.channel-player-v2 { background: #000; }

/* --- 主播信息条（毛玻璃） --- */
.MR-about {
    background: linear-gradient(to bottom, rgba(11,11,20,0.85), rgba(11,11,20,0)) !important;
}
.MR-about dl dt .photoer,
.MR-about dl dt img.anchor-head {
    border-radius: 50% !important;
    border: 2px solid #6366f1;
    box-shadow: 0 0 12px rgba(99,102,241,0.5);
}
.MR-about dl dd .name {
    font-weight: 700;
    font-size: 15px;
    color: #fff;
}
.MR-about .fans-num { color: #94a3b8 !important; }
.MR-about .signs { color: #cbd5e1 !important; }

/* --- 关注按钮 --- */
.MR-about .BTN-add-attention {
    background: linear-gradient(135deg, #6366f1, #4f46e5) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 4px 16px !important;
    font-weight: 600;
    transition: all 0.25s ease;
    box-shadow: 0 4px 12px rgba(99,102,241,0.4);
}
.MR-about .BTN-add-attention:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(99,102,241,0.55);
}
.MR-about .BTN-has-attention {
    background: transparent !important;
    border: 1px solid rgba(148,163,184,0.4) !important;
    color: #94a3b8 !important;
    border-radius: 20px !important;
}

/* --- 右侧聊天面板 --- */
.SR-area-chat,
.SR-area-chat .chat-msg,
.chat-gift {
    background: #12121f !important;
}
.SR-area-chat {
    border-radius: 0 16px 16px 0;
    box-shadow: -4px 0 30px rgba(0,0,0,0.5);
}

/* --- 顶部 Tab --- */
.SR-area-Tab { height: 36px !important; line-height: 36px !important; }
.SR-area-Tab li {
    background: #1a1a2e !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    transition: all 0.2s ease;
    cursor: pointer;
}
.SR-area-Tab li:hover { background: #22223a !important; color: #e2e8f0 !important; }
.SR-area-Tab li.on {
    background: #6366f1 !important;
    color: #fff !important;
    font-weight: 600;
}

/* --- 聊天消息 --- */
.msg-chat .MR-chat .boarder ul li {
    padding: 4px 10px !important;
    line-height: 1.5 !important;
    font-size: 13px !important;
}
.msg-chat .nickname, .msg-chat .uname {
    color: #818cf8 !important;
    font-weight: 600;
}
.msg-chat .content, .msg-chat .msg-content { color: #cbd5e1 !important; }

/* --- 在线用户 / 榜单 --- */
.MR-online .boarder ul li { transition: transform 0.2s ease; }
.MR-online .boarder ul li:hover { transform: scale(1.08); }
.now_Rank, .total_Rank { background: #12121f !important; }

/* --- 聊天输入区 --- */
.chat-talk { background: #12121f !important; }
.MR-talk { background: #12121f !important; }
.MR-talk .speaker {
    background: #1e1e35 !important;
    border: 1px solid rgba(99,102,241,0.25) !important;
    border-radius: 20px !important;
    transition: all 0.25s ease;
}
.MR-talk .speaker:hover,
.MR-talk .speaker:has(input.txt-focus) {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,0.15);
}
.MR-talk .speaker input {
    background: transparent !important;
    color: #f1f5f9 !important;
    border: none !important;
    font-size: 13px !important;
}
.MR-talk .speaker input::placeholder { color: #64748b; }
.MR-talk .send-btn {
    background: linear-gradient(135deg, #6366f1, #4f46e5) !important;
    color: #fff !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    transition: all 0.25s ease;
    box-shadow: 0 4px 12px rgba(99,102,241,0.4);
}
.MR-talk .send-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(99,102,241,0.55);
}

/* --- 礼物面板 --- */
.gift-tab li {
    background: #1a1a2e !important;
    color: #94a3b8 !important;
    border-radius: 8px 8px 0 0 !important;
    transition: all 0.2s ease;
}
.gift-tab li.on {
    background: #6366f1 !important;
    color: #fff !important;
}
.MR-gift .gift {
    background: #1e1e35 !important;
    border: 1px solid rgba(99,102,241,0.15) !important;
    border-radius: 10px !important;
    transition: all 0.22s ease;
}
.MR-gift .gift:hover {
    border-color: #6366f1 !important;
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(99,102,241,0.35);
}
.MR-gift .gift .gift-pic img { transition: transform 0.22s ease; }
.MR-gift .gift:hover .gift-pic img { transform: scale(1.12); }
.gift-footer { background: #12121f !important; }
.MR-moregift .send-btn {
    background: linear-gradient(135deg, #f43f5e, #e11d48) !important;
    color: #fff !important;
    border-radius: 20px !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 14px rgba(244,63,94,0.45);
    transition: all 0.25s ease;
}
.MR-moregift .send-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(244,63,94,0.6);
}

/* --- 点赞气泡 --- */
#player-praises .bubble { opacity: 0.9; }

/* --- 控制条 --- */
.control-bar { background: #1a1a2e !important; }

/* --- 左侧导航条 --- */
.SR-nav {
    background: #12121f !important;
    border-right: 1px solid rgba(99,102,241,0.15);
}
.SR-nav .nav-fg {
    background: #12121f !important;
    border-right: 1px solid rgba(99,102,241,0.15);
}
.SR-nav .nav-fg .login a,
.SR-nav .nav-fg .reg,
.SR-nav .nav-fg .no-login a {
    color: #cbd5e1 !important;
    background: transparent !important;
    border: none !important;
}
.SR-nav .nav-fg .login a:hover,
.SR-nav .nav-fg .no-login a:hover { color: #fff !important; }
.SR-nav .nav-fg .linked { color: #94a3b8 !important; }
.SR-nav .nav-fg .linked:hover { color: #fff !important; }
.SR-nav .nav li a { color: #94a3b8 !important; transition: color 0.2s ease; }
.SR-nav .nav li a:hover { color: #fff !important; }
.SR-nav .login .recharge {
    background: linear-gradient(135deg, #f59e0b, #d97706) !important;
    border-radius: 14px !important;
    color: #fff !important;
}

/* --- 礼物横幅（头条） --- */
.MR-big-gift .out-boxer {
    background: linear-gradient(135deg, rgba(99,102,241,0.9), rgba(79,70,229,0.9)) !important;
    border-radius: 30px !important;
    box-shadow: 0 4px 20px rgba(99,102,241,0.5);
}

/* --- 左侧信息栏整体 --- */
.SR-area-info {
    background: #12121f !important;
    border-radius: 16px 0 0 16px;
    overflow: hidden;
}

/* --- 主播信息卡 --- */
.SR-anchor-info {
    background: linear-gradient(160deg, #1e1e35, #191930) !important;
    padding: 18px 14px !important;
}
.SR-anchor-info-avatar .anchor_avatar {
    border: 2px solid #6366f1 !important;
    box-shadow: 0 0 12px rgba(99,102,241,0.45);
}
.SR-anchor-info-nicename { color: #f1f5f9 !important; font-weight: 700; }
.SR-anchor-info-bottom { border-top: 1px solid rgba(99,102,241,0.2) !important; }
.SR-anchor-info-bottom p { color: #94a3b8 !important; }
.follow_status {
    background: linear-gradient(135deg, #6366f1, #4f46e5) !important;
    border-radius: 14px !important;
    font-weight: 600;
    box-shadow: 0 3px 10px rgba(99,102,241,0.4);
    transition: all 0.2s ease;
}
.follow_status:hover { transform: translateY(-1px); }
.fans_num { color: #94a3b8 !important; }

/* --- 贡献榜 --- */
.MR-rank { background: transparent !important; }
.MR-rank .tab { background: #1a1a2e !important; }
.MR-rank .tab li { color: #94a3b8 !important; transition: color 0.2s ease; }
.MR-rank .tab li.on { color: #fff !important; }
.MR-rank .tab-con { background: #1e1e35 !important; }
.MR-rank .thr .name, .MR-rank .other .name { color: #cbd5e1 !important; }
.MR-rank .thr .coins, .MR-rank .other .coins { color: #f59e0b !important; }

/* --- 在线用户 --- */
.MR-online { background: #1e1e35 !important; }
.MR-online .nav-tab { background: #1a1a2e !important; }
.MR-online .nav-tab li { color: #94a3b8 !important; }
.MR-online .nav-tab li.on { color: #fff !important; }
.MR-online .boarder ul li span { color: #cbd5e1 !important; }

/* --- 主播推荐浮层 --- */
.SR-video-rec-con {
    background: rgba(18,18,31,0.92) !important;
    border: 1px solid rgba(99,102,241,0.3) !important;
    border-radius: 16px !important;
    backdrop-filter: blur(8px);
    box-shadow: 0 8px 40px rgba(0,0,0,0.6) !important;
}
.SR-video-rec-con .rec-title {
    color: #f1f5f9 !important;
    font-weight: 800;
    letter-spacing: 2px;
}
.SR-video-rec-con .rec-title::after {
    content: '';
    display: block;
    width: 36px; height: 3px;
    margin: 6px auto 0;
    border-radius: 2px;
    background: linear-gradient(90deg, #6366f1, #f43f5e);
}
.SR-video-rec-con .video-rec-con .rec-item {
    background: #1e1e35;
    border: 1px solid rgba(99,102,241,0.2);
    border-radius: 12px;
    padding: 4px 4px 0;
    transition: all 0.22s ease;
}
.SR-video-rec-con .video-rec-con .rec-item:hover {
    border-color: #6366f1;
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(99,102,241,0.35);
}
.SR-video-rec-con .video-rec-con .rec-item img {
    border-radius: 8px;
}
.SR-video-rec-con .video-rec-con .rec-item .rec-author-name {
    color: #e2e8f0 !important;
    font-weight: 600;
}

/* --- 开播管理面板（主播本人视角） --- */
.SR-area-video .player {
    background-image: none !important;
    background: radial-gradient(120% 90% at 50% 0%, #232345 0%, #14142a 60%, #0d0d1c 100%) !important;
}
.SR-area-video .startroom_text {
    color: #cbd5e1 !important;
    text-shadow: none;
}
.SR-area-video .startroom_text p {
    color: #cbd5e1 !important;
}
.SR-area-video .startroom_text p[style*="color:#5c5959"],
.SR-area-video .startroom_text p[style*="color: #5c5959"] {
    color: #818cf8 !important;
    font-family: Consolas, Monaco, monospace;
    word-break: break-all;
}
.SR-area-video .startroom_text hr {
    border: none;
    border-top: 1px solid rgba(99,102,241,0.25);
    margin: 14px 0;
}
.SR-area-video .startroom_text .copystream,
.SR-area-video .startroom_text .copystream1 {
    background: transparent;
    border: none;
    color: #f43f5e;
    cursor: pointer;
    font-size: inherit;
    padding: 0;
}
.SR-area-video .startroom_text .copystream:hover,
.SR-area-video .startroom_text .copystream1:hover { color: #fb7185; }
.SR-area-video .startroom_icon {
    background: linear-gradient(135deg, #6366f1, #4f46e5) !important;
    color: #fff !important;
    border-radius: 26px !important;
    font-weight: 700;
    letter-spacing: 2px;
    box-shadow: 0 6px 22px rgba(99,102,241,0.5);
    transition: all 0.25s ease;
    cursor: pointer;
}
.SR-area-video .startroom_icon:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(99,102,241,0.65);
}
.SR-area-video .closeroom_icon,
.SR-area-video .forbidroom_icon,
.SR-area-video .roomchange_icon {
    background: rgba(15,15,26,0.75) !important;
    color: #f1f5f9 !important;
    border: 1px solid rgba(99,102,241,0.35) !important;
    border-radius: 16px !important;
    backdrop-filter: blur(6px);
}

/* --- 响应式：窄屏隐藏左侧导航，聊天面板堆叠 --- */
@media (max-width: 1200px) {
    .SR-stager { width: 100% !important; }
    .SR-nav { display: none !important; }
}
@media (max-width: 900px) {
    .SR-area-chat {
        float: none !important;
        width: 100% !important;
        border-radius: 0 !important;
    }
    .SR-area-video {
        float: none !important;
        width: 100% !important;
        height: auto !important;
        min-height: 240px;
        border-radius: 0 !important;
    }
}