/* ================================================
   Glassmorphism Enhancement CSS
   统一白色发光 + 毛玻璃 + UI过渡动画
   ================================================ */

/* ===== CSS 自定义属性 ===== */
:root {
    --glow-color: rgba(255, 255, 255, 0.6);
    --glow-color-strong: rgba(255, 255, 255, 0.85);
    --glow-color-subtle: rgba(255, 255, 255, 0.2);
    --glow-spread: 0 0 15px var(--glow-color), 0 0 30px var(--glow-color-subtle);
    --glow-spread-strong: 0 0 20px var(--glow-color-strong), 0 0 40px var(--glow-color), 0 0 60px var(--glow-color-subtle);
    --glow-border: 1px solid rgba(255, 255, 255, 0.15);
    --glow-border-hover: 1px solid rgba(255, 255, 255, 0.4);
    --glass-transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    --glass-transition-fast: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --glass-transition-slow: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== 发光动画关键帧 ===== */
@keyframes glowPulse {
    0%, 100% {
        box-shadow: 0 0 10px var(--glow-color-subtle), 0 0 20px transparent;
        border-color: rgba(255, 255, 255, 0.1);
    }
    50% {
        box-shadow: var(--glow-spread);
        border-color: rgba(255, 255, 255, 0.3);
    }
}

@keyframes glowBreath {
    0%, 100% {
        box-shadow: 0 0 8px transparent, 0 0 16px transparent;
    }
    50% {
        box-shadow: 0 0 12px var(--glow-color-subtle), 0 0 24px rgba(255, 255, 255, 0.05);
    }
}

@keyframes borderGlowRotate {
    0% { --glow-angle: 0deg; }
    100% { --glow-angle: 360deg; }
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.92) translateY(10px);
        filter: blur(6px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
        filter: blur(0);
    }
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
        filter: blur(4px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
        filter: blur(4px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
    }
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
        filter: blur(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

@keyframes borderGlowSweep {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ===== 粒子画布 ===== */
#particle-canvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999999;
}

/* ===== 导航栏增强 ===== */
.head {
    transition: var(--glass-transition) !important;
    border-bottom: var(--glow-border) !important;
}

.head:hover {
    box-shadow: 0 0 20px var(--glow-color-subtle), 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    border-bottom-color: rgba(255, 255, 255, 0.25) !important;
}

.head .head-nav li a,
.head .head-nav li goLink {
    position: relative;
    transition: var(--glass-transition-fast) !important;
}

.head .head-nav li a::after,
.head .head-nav li goLink::after {
    content: '';
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%) scaleX(0);
    width: 70%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--glow-color-strong), transparent);
    border-radius: 2px;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.35s ease;
    box-shadow: 0 0 8px transparent;
}

.head .head-nav li a:hover::after,
.head .head-nav li goLink:hover::after,
.head .head-nav li a.current::after,
.head .head-nav li goLink.current::after {
    transform: translateX(-50%) scaleX(1);
    box-shadow: 0 0 12px var(--glow-color), 0 0 24px var(--glow-color-subtle);
}

.head .margin {
    transition: var(--glass-transition-fast) !important;
}

.head .margin:hover {
    text-shadow: 0 0 12px var(--glow-color);
}

/* ===== 视频卡片发光（核心效果） ===== */
.public-list-box {
    position: relative;
    transition: var(--glass-transition) !important;
    outline: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 14px !important;
}

.public-list-box::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 15px;
    padding: 1px;
    background: linear-gradient(
        135deg,
        transparent 30%,
        rgba(255, 255, 255, 0.15) 50%,
        transparent 70%
    );
    background-size: 300% 300%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
    z-index: 2;
}

.public-list-box:hover::before {
    opacity: 1;
    animation: borderGlowSweep 2s ease infinite;
}

.public-list-box:hover {
    box-shadow: 0 0 20px var(--glow-color-subtle), 0 0 40px rgba(255, 255, 255, 0.08), 0 8px 32px rgba(0, 0, 0, 0.3);
    transform: translateY(-4px) scale(1.015);
    outline-color: rgba(255, 255, 255, 0.3);
    z-index: 10;
}

.public-list-box:hover .public-list-div {
    overflow: hidden;
    border-radius: 14px;
}

.public-list-box:hover .lazy {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), filter 0.6s ease;
    transform: scale(1.06);
    filter: brightness(1.1);
}

.public-list-box:hover .public-bg {
    transition: opacity 0.4s ease;
    opacity: 0.85;
}

/* 视频卡片容器发光动画 */
/* 注意: public-list-exp 原始为 position:absolute (依赖 public-list-div 的 height:0 + padding-top 布局) */
/* 不覆盖 position，仅添加圆角和发光伪元素 */
.public-list-box .public-list-exp {
    border-radius: 14px;
}

.public-list-box .public-list-exp::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 14px;
    box-shadow: inset 0 0 0 1px transparent;
    transition: box-shadow 0.4s ease;
    pointer-events: none;
}

.public-list-box:hover .public-list-exp::after {
    box-shadow: inset 0 0 30px rgba(255, 255, 255, 0.12);
}

/* ===== 内容卡片毛玻璃 + 发光 ===== */
.p-box,
.public-box,
.box {
    transition: var(--glass-transition) !important;
    border: var(--glow-border) !important;
    position: relative;
}

/* 排除资源列表选集的边框干扰 */
.anthology-list-play li.box {
    border: none !important;
    transition: all 0.25s ease !important;
}

/* 资源列表选集 - 胶囊/药丸形状 */
.anthology-list-play li {
    border-radius: 25px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    transition: all 0.25s ease !important;
}

.anthology-list-play li:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.08);
}

.anthology-list-play li.on {
    background: rgba(255, 255, 255, 0.18) !important;
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.15), inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

/* 资源列表选源tab - 胶囊形状 */
.anthology-tab a {
    border-radius: 20px !important;
    transition: all 0.25s ease !important;
}

.anthology-tab a:hover {
    background: rgba(255, 255, 255, 0.08);
}

.anthology-tab a.on {
    background: rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.1);
}

/* 选源tab底部指示线改为白色 */
.anthology-tab a.on::after {
    background: rgba(255, 255, 255, 0.7) !important;
    border-radius: 2px;
}

/* 播放器右侧选集tab同理 */
.player-right .switch-button .selected::after {
    background: rgba(255, 255, 255, 0.7) !important;
}

.p-box:hover,
.public-box:hover {
    box-shadow: var(--glow-spread), 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    border-color: rgba(255, 255, 255, 0.35) !important;
    transform: translateY(-2px);
}

.box:hover {
    box-shadow: 0 0 15px var(--glow-color-subtle), 0 8px 32px rgba(0, 0, 0, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.28) !important;
}

/* ===== 搜索框发光 ===== */
.this-search,
#search1 {
    transition: var(--glass-transition) !important;
    border: var(--glow-border) !important;
}

.this-search:focus-within,
#search1:focus-within {
    box-shadow: var(--glow-spread), 0 4px 20px rgba(0, 0, 0, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
}

#searchHistory {
    transition: var(--glass-transition) !important;
    border: var(--glow-border) !important;
    animation: fadeInScale 0.3s ease-out !important;
}

/* ===== 更多菜单弹出层发光 ===== */
.cms-nav-more-container {
    transition: var(--glass-transition) !important;
    border: var(--glow-border) !important;
    animation: fadeInScale 0.25s ease-out !important;
}

.cms-nav-more-item {
    transition: var(--glass-transition-fast) !important;
    border: 1px solid transparent !important;
}

.cms-nav-more-item:hover {
    box-shadow: 0 0 15px var(--glow-color-subtle) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    text-shadow: 0 0 8px var(--glow-color);
}

/* ===== 按钮发光 ===== */
.button,
.button2,
.this-get,
.flow-more a {
    transition: var(--glass-transition-fast) !important;
    position: relative;
    overflow: hidden;
}

.button::before,
.this-get::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(
        45deg,
        transparent 40%,
        rgba(255, 255, 255, 0.12) 45%,
        rgba(255, 255, 255, 0.2) 50%,
        rgba(255, 255, 255, 0.12) 55%,
        transparent 60%
    );
    transform: translateX(-100%);
    transition: none;
    pointer-events: none;
}

.button:hover::before,
.this-get:hover::before {
    transform: translateX(100%);
    transition: transform 0.6s ease;
}

.button:hover,
.this-get:hover {
    box-shadow: var(--glow-spread) !important;
    text-shadow: 0 0 10px var(--glow-color);
}

.flow-more a:hover {
    box-shadow: 0 0 12px var(--glow-color-subtle);
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.08) !important;
}

/* ===== 输入框发光 ===== */
.input,
.textarea {
    transition: var(--glass-transition-fast) !important;
    border: var(--glow-border) !important;
}

.input:focus,
.textarea:focus {
    box-shadow: var(--glow-spread) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
}

/* ===== 页脚发光 ===== */
.footer .box {
    transition: var(--glass-transition) !important;
    border: var(--glow-border) !important;
}

.footer .box:hover {
    box-shadow: 0 0 20px var(--glow-color-subtle), 0 8px 32px rgba(0, 0, 0, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
}

.footer a:hover {
    text-shadow: 0 0 10px var(--glow-color);
}

/* ===== 链接全局hover发光 ===== */
a {
    transition: color 0.3s ease, text-shadow 0.3s ease !important;
}

a:hover {
    text-shadow: 0 0 8px var(--glow-color-subtle) !important;
}

/* ===== 滚动进入动画 ===== */
.box-width {
    opacity: 1;
}

.glass-animate {
    animation: fadeInScale 0.6s cubic-bezier(0.4, 0, 0.2, 1) both;
}

.glass-animate-left {
    animation: slideInLeft 0.6s cubic-bezier(0.4, 0, 0.2, 1) both;
}

.glass-animate-right {
    animation: slideInRight 0.6s cubic-bezier(0.4, 0, 0.2, 1) both;
}

.glass-animate-up {
    animation: slideInUp 0.7s cubic-bezier(0.4, 0, 0.2, 1) both;
}

/* 延迟类 */
.glass-delay-1 { animation-delay: 0.1s; }
.glass-delay-2 { animation-delay: 0.2s; }
.glass-delay-3 { animation-delay: 0.3s; }
.glass-delay-4 { animation-delay: 0.4s; }
.glass-delay-5 { animation-delay: 0.5s; }

/* ===== 呼吸发光效果（用于重要元素） ===== */
.glass-breathe {
    animation: glowBreath 3s ease-in-out infinite;
}

/* ===== 鼠标追踪发光边框容器 ===== */
.mouse-glow-track {
    position: relative;
    overflow: hidden;
}

.mouse-glow-track::after {
    content: '';
    position: absolute;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--glow-color-subtle) 0%, transparent 70%);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
    transform: translate(-50%, -50%);
    z-index: 1;
    mix-blend-mode: screen;
}

.mouse-glow-track:hover::after {
    opacity: 1;
}

/* ===== 滚动条白色发光 ===== */
::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2) !important;
    transition: background 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4) !important;
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.2);
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1) !important;
}

/* ===== 标题区域发光 ===== */
.title-a {
    position: relative;
    transition: var(--glass-transition) !important;
}

.title-a .this-name {
    position: relative;
    display: inline-block;
}

.title-a .this-name::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--glow-color-strong), transparent);
    border-radius: 2px;
    opacity: 0.4;
    transition: opacity 0.3s ease, width 0.3s ease;
    box-shadow: 0 0 8px var(--glow-color-subtle);
}

.title-a:hover .this-name::after {
    opacity: 0.8;
}

/* ===== 弹窗/下拉面板动画 ===== */
.window-box,
.pop-box,
.drawer-list-box,
#searchHistory,
#cms-nav-more-box {
    animation: fadeInScale 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* ===== 分页发光 ===== */
.page-info a,
.page-info span {
    transition: var(--glass-transition-fast) !important;
    border: 1px solid transparent;
    border-radius: 8px;
}

.page-info a:hover,
.page-info span:hover {
    box-shadow: 0 0 12px var(--glow-color-subtle);
    border-color: rgba(255, 255, 255, 0.2);
    text-shadow: 0 0 8px var(--glow-color);
}

/* ===== 选项卡/标签发光 ===== */
.switch-button span,
.filter-text,
.filter-reselect {
    transition: var(--glass-transition-fast) !important;
    border: 1px solid transparent !important;
}

.switch-button span:hover,
.switch-button .selected {
    box-shadow: 0 0 12px var(--glow-color-subtle) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* ===== 弹幕标签发光 ===== */
.public-prt,
.p-type,
.cr1, .cr2, .cr3, .cr4, .cr5, .cr6, .cr7, .cr8,
.badge2 {
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.1);
    transition: var(--glass-transition-fast) !important;
}

.public-prt:hover,
.p-type:hover,
.badge2:hover {
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.25);
}

/* ===== 图片懒加载发光过渡 ===== */
.lazy {
    transition: opacity 0.6s ease, transform 0.5s ease, filter 0.5s ease !important;
}

.lazy[data-ll-status="entered"] {
    opacity: 1;
    filter: blur(0) !important;
}

.lazy[data-ll-status="loading"] {
    filter: blur(8px) brightness(0.7) !important;
    opacity: 0.6;
}

/* ===== 全局毛玻璃呼吸 ===== */
.theme2 .p-box,
.theme2 .box,
.theme2 .public-box {
    animation: glowBreath 4s ease-in-out infinite;
}

.theme2 .p-box:hover,
.theme2 .box:hover,
.theme2 .public-box:hover {
    animation: none;
    box-shadow: var(--glow-spread-strong), 0 8px 32px rgba(0, 0, 0, 0.25) !important;
}

/* ===== 适配移动端减少动画 ===== */
@media (max-width: 768px) {
    .public-list-box:hover {
        transform: none;
        box-shadow: 0 0 12px var(--glow-color-subtle);
    }
    .p-box:hover,
    .box:hover,
    .public-box:hover {
        transform: none;
    }
    .glass-animate,
    .glass-animate-left,
    .glass-animate-right,
    .glass-animate-up {
        animation: none !important;
    }
    .theme2 .p-box,
    .theme2 .box,
    .theme2 .public-box {
        animation: none !important;
    }
    #particle-canvas {
        display: none;
    }
}

/* ===== 尊重用户减少动画偏好 ===== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    #particle-canvas {
        display: none;
    }
}

/* ===== Shimmer 加载效果 ===== */
.glass-shimmer {
    position: relative;
    overflow: hidden;
}

.glass-shimmer::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.06) 50%,
        transparent 100%
    );
    background-size: 200% 100%;
    animation: shimmer 2s ease-in-out infinite;
    pointer-events: none;
}

/* ===== 光效边框旋转（仅用于重要卡片） ===== */
.glass-rotating-border {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
}

.glass-rotating-border::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 18px;
    background: conic-gradient(
        from 0deg,
        transparent 0%,
        var(--glow-color-subtle) 10%,
        transparent 20%,
        transparent 100%
    );
    animation: borderGlowRotate 4s linear infinite;
    z-index: -1;
}

.glass-rotating-border::after {
    content: '';
    position: absolute;
    inset: 1px;
    border-radius: 15px;
    background: inherit;
    z-index: -1;
}

/* ===== 历史记录弹窗发光 ===== */
#his_show {
    border: var(--glow-border) !important;
    box-shadow: var(--glow-spread), 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}

/* ===== 全局点击波纹效果 ===== */
.click-ripple {
    position: fixed;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.4) 0%, transparent 70%);
    pointer-events: none;
    z-index: 9999998;
    animation: rippleExpand 0.6s ease-out forwards;
}

@keyframes rippleExpand {
    0% {
        width: 0;
        height: 0;
        opacity: 1;
    }
    100% {
        width: 150px;
        height: 150px;
        opacity: 0;
    }
}

/* ===== 播放页播放器 - 仅保留边框，取消悬停效果 ===== */
.player-vod-box,
.bj3 {
    border: var(--glow-border) !important;
    transition: var(--glass-transition) !important;
}

/* 播放器不添加hover发光效果，避免干扰观看体验 */

/* ===== 演员卡片发光 ===== */
.br-100,
.actor-new img {
    transition: var(--glass-transition) !important;
    border: 2px solid transparent !important;
}

.br-100:hover,
.actor-new img:hover {
    border-color: rgba(255, 255, 255, 0.4) !important;
    box-shadow: 0 0 20px var(--glow-color-subtle), 0 0 40px rgba(255, 255, 255, 0.05) !important;
}

/* ===== 评论区域发光 ===== */
.section-bd .comment-subject,
.textarea,
.comment-content {
    transition: var(--glass-transition) !important;
    border: var(--glow-border) !important;
}

.section-bd .comment-subject:hover,
.comment-content:hover {
    box-shadow: 0 0 12px var(--glow-color-subtle) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* ===== Logo 发光 ===== */
.logo-brand {
    transition: var(--glass-transition) !important;
}

.logo-brand:hover {
    filter: drop-shadow(0 0 12px var(--glow-color));
    transform: scale(1.03);
}

.logo-brand img {
    transition: var(--glass-transition) !important;
}

.logo-brand:hover img {
    filter: brightness(1.1) drop-shadow(0 0 10px var(--glow-color));
}

/* ===== 排行榜/列表项发光 ===== */
.vod-link,
.history-a,
.rank-url,
.slide-time-list a {
    transition: var(--glass-transition-fast) !important;
    border: 1px solid transparent;
    border-radius: 10px;
}

.vod-link:hover,
.history-a:hover,
.rank-url:hover,
.slide-time-list a:hover {
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.04) !important;
}

/* ===== 通用hover放大效果 ===== */
.gen-movie-img,
.lazy-p {
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), filter 0.5s ease !important;
}
