/*
 * 新站外观皮肤：Wide Cinema Layout
 * 适合 16:9 横版封面
 * 只改外观，不改功能。
 */

:root{
    --bg:#070b14;
    --bg-soft:#0d1424;
    --panel:#111a2d;
    --panel2:#0c1322;
    --line:rgba(148,163,184,.16);
    --text:#eef6ff;
    --muted:#94a3b8;
    --brand:#38bdf8;
    --brand2:#a78bfa;
    --radius:22px;
    --shadow:0 20px 60px rgba(0,0,0,.36);
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    background:
        radial-gradient(circle at 18% -8%, rgba(56,189,248,.18), transparent 34%),
        radial-gradient(circle at 88% 2%, rgba(167,139,250,.16), transparent 34%),
        linear-gradient(180deg,#070b14 0%,#080d18 52%,#05070d 100%)!important;
    color:var(--text)!important;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",Arial,sans-serif;
}

a{
    color:inherit;
    text-decoration:none;
}

img{
    max-width:100%;
}

/* 顶部 */
.header,
.site-header,
.topbar,
.navbar{
    background:rgba(7,11,20,.82)!important;
    border-bottom:1px solid var(--line)!important;
    backdrop-filter:blur(18px);
    box-shadow:0 12px 34px rgba(0,0,0,.24);
}

.logo,
.site-logo,
.brand,
.header .title{
    font-weight:900!important;
    letter-spacing:.4px;
    background:linear-gradient(135deg,#fff,var(--brand),var(--brand2));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent!important;
}

.nav a,
.menu a,
.header a{
    transition:.2s ease;
}

.nav a:hover,
.menu a:hover,
.header a:hover{
    color:var(--brand)!important;
}

/* 搜索和按钮 */
input[type="text"],
input[type="search"],
.search-input,
.search-box input{
    background:rgba(15,23,42,.9)!important;
    color:#fff!important;
    border:1px solid rgba(148,163,184,.22)!important;
    border-radius:999px!important;
    outline:none!important;
}

input::placeholder{
    color:rgba(148,163,184,.76)!important;
}

button,
.btn,
.search-btn,
.submit{
    border:0!important;
    border-radius:999px!important;
    background:linear-gradient(135deg,var(--brand),var(--brand2))!important;
    color:#fff!important;
    box-shadow:0 12px 28px rgba(56,189,248,.18);
    transition:.22s ease;
}

button:hover,
.btn:hover,
.search-btn:hover,
.submit:hover{
    transform:translateY(-1px);
    box-shadow:0 18px 38px rgba(167,139,250,.24);
}

/* 容器 */
.container,
.wrap,
.main,
.page-wrap{
    width:min(1320px,94vw)!important;
}

/* 分类 */
.category-bar,
.categories,
.cat-list,
.category-list{
    background:rgba(17,26,45,.66)!important;
    border:1px solid var(--line)!important;
    border-radius:24px!important;
    padding:14px!important;
    box-shadow:var(--shadow);
    backdrop-filter:blur(14px);
}

.category-bar a,
.categories a,
.cat-list a,
.category-list a,
.cat-item{
    background:rgba(255,255,255,.055)!important;
    border:1px solid rgba(148,163,184,.14)!important;
    color:#dbeafe!important;
    border-radius:999px!important;
    transition:.2s ease;
}

.category-bar a:hover,
.categories a:hover,
.cat-list a:hover,
.category-list a:hover,
.cat-item:hover,
.category-bar a.active,
.categories a.active,
.cat-list a.active,
.category-list a.active{
    background:linear-gradient(135deg,var(--brand),var(--brand2))!important;
    color:#fff!important;
    border-color:transparent!important;
}

/* =========================
   真正横版影视布局
   电脑：3列大横卡
   平板：2列
   手机：1列
========================= */

.video-grid,
.grid,
.vod-list,
.video-list{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:24px!important;
    align-items:start!important;
}

@media(max-width:1100px){
    .video-grid,
    .grid,
    .vod-list,
    .video-list{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:18px!important;
    }
}

@media(max-width:640px){
    .video-grid,
    .grid,
    .vod-list,
    .video-list{
        grid-template-columns:1fr!important;
        gap:16px!important;
    }
}

/* 卡片改成宽屏海报 */
.video-card,
.vod-card,
.card,
.item{
    position:relative!important;
    overflow:hidden!important;
    display:block!important;
    min-height:auto!important;
    aspect-ratio:16/9!important;
    border-radius:24px!important;
    background:#0b1220!important;
    border:1px solid rgba(148,163,184,.14)!important;
    box-shadow:0 20px 55px rgba(0,0,0,.34)!important;
    transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease!important;
}

.video-card:hover,
.vod-card:hover,
.card:hover,
.item:hover{
    transform:translateY(-5px)!important;
    border-color:rgba(56,189,248,.36)!important;
    box-shadow:
        0 28px 72px rgba(0,0,0,.45),
        0 0 0 1px rgba(56,189,248,.08)!important;
}

/* 图片填满整张卡 */
.video-card img,
.vod-card img,
.card img,
.item img,
.video-card .cover img,
.vod-card .cover img,
.card .cover img,
.item .cover img{
    width:100%!important;
    height:100%!important;
    aspect-ratio:auto!important;
    object-fit:cover!important;
    display:block!important;
    border-radius:0!important;
    transition:transform .38s ease, filter .38s ease!important;
}

.video-card:hover img,
.vod-card:hover img,
.card:hover img,
.item:hover img{
    transform:scale(1.045)!important;
    filter:saturate(1.08) contrast(1.04)!important;
}

/* 如果外层有封面容器，也让它铺满 */
.video-card .cover,
.vod-card .cover,
.card .cover,
.item .cover,
.video-card .thumb,
.vod-card .thumb,
.card .thumb,
.item .thumb{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
}

/* 底部电影感渐变 */
.video-card::after,
.vod-card::after,
.card::after,
.item::after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:58%!important;
    background:linear-gradient(
        to top,
        rgba(0,0,0,.88) 0%,
        rgba(0,0,0,.58) 35%,
        rgba(0,0,0,.12) 76%,
        transparent 100%
    )!important;
    pointer-events:none!important;
    z-index:1!important;
}

/* 标题压在封面底部 */
.video-title,
.vod-title,
.card-title,
.item-title,
.video-card h3,
.vod-card h3,
.card h3,
.item h3{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    bottom:14px!important;
    z-index:3!important;
    margin:0!important;
    padding:0!important;
    color:#fff!important;
    font-size:16px!important;
    font-weight:800!important;
    line-height:1.42!important;
    text-shadow:0 2px 12px rgba(0,0,0,.68)!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
}

/* 手机标题稍小 */
@media(max-width:640px){
    .video-title,
    .vod-title,
    .card-title,
    .item-title,
    .video-card h3,
    .vod-card h3,
    .card h3,
    .item h3{
        left:14px!important;
        right:14px!important;
        bottom:13px!important;
        font-size:15px!important;
    }
}

/* 删除/隐藏“高清”等角标 */
.badge,
.tag,
.remarks,
.status,
.pic-text,
.pic-tag,
.vod-remarks,
.video-remarks,
.corner,
.corner-tag,
.hd,
.quality,
.quality-tag{
    display:none!important;
}

/* 隐藏卡片里杂乱的副信息 */
.meta,
.video-meta,
.vod-meta,
.desc,
.video-desc,
.vod-desc,
.item-desc,
.card-desc{
    display:none!important;
}

/* 避免原主题给标题区域留白 */
.video-card .info,
.vod-card .info,
.card .info,
.item .info,
.video-card .content,
.vod-card .content,
.card .content,
.item .content{
    position:static!important;
    padding:0!important;
    margin:0!important;
    background:transparent!important;
}

/* 播放页 */
.player-wrap,
.player-box,
.video-player,
.play-box{
    background:#020617!important;
    border:1px solid rgba(56,189,248,.18)!important;
    border-radius:26px!important;
    box-shadow:0 28px 90px rgba(0,0,0,.5)!important;
    overflow:hidden!important;
}

.detail-box,
.info-box,
.video-info{
    background:rgba(17,26,45,.74)!important;
    border:1px solid var(--line)!important;
    border-radius:22px!important;
    box-shadow:var(--shadow);
}

h1,h2,h3{
    color:#f8fbff;
}

.section-title,
.title-row h2,
.block-title{
    position:relative;
    padding-left:14px;
}

.section-title::before,
.title-row h2::before,
.block-title::before{
    content:"";
    position:absolute;
    left:0;
    top:.22em;
    bottom:.22em;
    width:4px;
    border-radius:999px;
    background:linear-gradient(180deg,var(--brand),var(--brand2));
}

/* 友情链接和底部 */
.friend-links,
.links,
.footer,
.site-footer{
    background:rgba(7,11,20,.82)!important;
    border-top:1px solid var(--line)!important;
    color:var(--muted)!important;
}

.friend-links a,
.links a,
.footer a,
.site-footer a{
    color:#c7d2fe!important;
}

.friend-links a:hover,
.links a:hover,
.footer a:hover,
.site-footer a:hover{
    color:var(--brand)!important;
}

/* 分页 */
.pagination a,
.page-numbers,
.pager a{
    background:rgba(255,255,255,.06)!important;
    color:#dbeafe!important;
    border:1px solid rgba(148,163,184,.16)!important;
    border-radius:12px!important;
}

.pagination a:hover,
.page-numbers.current,
.pager a:hover{
    background:linear-gradient(135deg,var(--brand),var(--brand2))!important;
    color:#fff!important;
}

/* 手机分类保持 4列，不横滑 */
@media(max-width:768px){
    .category-bar,
    .categories,
    .cat-list,
    .category-list{
        display:grid!important;
        grid-template-columns:repeat(4,1fr)!important;
        gap:8px!important;
        max-height:none!important;
        overflow:visible!important;
    }

    .category-bar a,
    .categories a,
    .cat-list a,
    .category-list a,
    .cat-item{
        min-width:0!important;
        width:100%!important;
        text-align:center!important;
        font-size:12px!important;
        padding:8px 4px!important;
        white-space:nowrap!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }
}

@media(max-width:390px){
    .category-bar a,
    .categories a,
    .cat-list a,
    .category-list a,
    .cat-item{
        font-size:11px!important;
    }
}
