/* ------------------------------------
 * Panflix Theme CSS
 *
 * @author  hygd0813
 * @link  https://www.panflix.cn
 * @update  2025-09-03
 * --------------------------------- */

/* ------------------
 * Global style
 * --------------- */
body {
        @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap');
        
        * {
            font-family: 'Noto Sans SC', sans-serif;
        }
}

/* ------------------
 * Index style
 * --------------- */
        .gradient-bg {
            background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);
        }
        
        .card-hover {
            transition: all 0.3s ease;
        }
        
        .card-hover:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
        }
        
        .nav-item {
            position: relative;
            overflow: hidden;
        }
        
        .nav-item::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            height: 2px;
            width: 0;
            background: #f59e0b;
            transition: width 0.3s ease;
        }
        
        .nav-item:hover::after,
        .nav-item.active::after {
            width: 100%;
        }
        
        .category-card {
            background: rgba(255, 255, 255, 0.05);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        .scroll-container {
            scrollbar-width: thin;
            scrollbar-color: #4b5563 #1f2937;
        }
        
        .scroll-container::-webkit-scrollbar {
            height: 6px;
        }
        
        .scroll-container::-webkit-scrollbar-track {
            background: #1f2937;
        }
        
        .scroll-container::-webkit-scrollbar-thumb {
            background: #4b5563;
            border-radius: 3px;
        }
        
        .badge-new {
            animation: pulse 2s infinite;
        }
        
        @keyframes pulse {
            0% {
                box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7);
            }
            70% {
                box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
            }
            100% {
                box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
            }
        }
        
		/* 在CSS中添加 */
		#film, #tv, #photo-film, #video, #dragon, #music {
		    scroll-margin-top: 80px;
		}
		
		
		
/* ------------------
* category style
* --------------- */
        .glass-effect {
            background: rgba(255, 255, 255, 0.05);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        .hover-scale {
            transition: transform 0.3s ease;
        }
        
        .hover-scale:hover {
            transform: scale(1.05);
        }
        
        .nav-link {
            position: relative;
            transition: color 0.3s ease;
        }
        
        .nav-link::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 0;
            width: 0;
            height: 2px;
            background: #667eea;
            transition: width 0.3s ease;
        }
        
        .nav-link:hover::after,
        .nav-link.active::after {
            width: 100%;
        }
        
        .card {
            opacity: 0;
            transform: translateY(20px);
            transition: all 0.3s ease;
        }
        
        .card.show {
            opacity: 1;
            transform: translateY(0);
        }
        
        .filter-btn {
            transition: all 0.3s ease;
        }
        
        .filter-btn.active {
            background: #667eea;
            color: white;
        }
        
        .rating-star {
            color: #fbbf24;
        }
        
        .tag {
            transition: all 0.3s ease;
        }
        
        .tag:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
        }
        
        .scroll-smooth {
            scroll-behavior: smooth;
        }
        
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }
        
        .fade-in {
            animation: fadeIn 0.6s ease forwards;
        }

/* ------------------
* post style
* --------------- */

#post-content .content p {margin-top:.75rem;margin-bottom:.75rem;}
#post-content .content h1 h2 {margin-top:1.5rem;margin-bottom:1.5rem;font:green;}
#post-content .content h3 h4 {margin-top:1rem;margin-bottom:1rem;font:green;}
/* ------------------
* 分页自定义样式
* --------------- */
.page-navigator {
  list-style: none;margin: 1.5rem 0;padding: 0;text-align: center;}
.page-navigator li {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    display: inline-block;
    FONT-WEIGHT: bold; MARGIN: .25rem; COLOR: #fff;
    border-radius: 0.25rem;TEXT-ALIGN: center;
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
}
.page-navigator a {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
  FONT-WEIGHT: bold; COLOR: #fff;TEXT-DECORATION: none;border-radius: 0.25rem;
}
.page-navigator a:hover {
  COLOR: #fff; --tw-bg-opacity: 1;background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
}
.page-navigator a:active {
  COLOR: #666;  --tw-bg-opacity: 1;background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
}
.page-navigator .current a {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
  FONT-WEIGHT: bold; COLOR: #fff;
    border-radius: 0.25rem;
    --tw-bg-opacity: 1;background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
}

/* 赞踩评级 */
.p_star{ width: 100px; position: absolute;display: inline;}
.product-star10 { background: url(../../panflix/img/rating/star10.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star9 { background: url(../../panflix/img/rating/star9.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star8 { background: url(../../panflix/img/rating/star8.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star7 { background: url(../../panflix/img/rating/star7.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star6 { background: url(../../panflix/img/rating/star6.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star5 { background: url(../../panflix/img/rating/star5.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star4 { background: url(../../panflix/img/rating/star4.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star3 { background: url(../../panflix/img/rating/star3.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star2 { background: url(../../panflix/img/rating/star2.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star1 { background: url(../../panflix/img/rating/star1.png) no-repeat 0px center; height: 24px; background-size: 90px; }
.product-star0 { background: url(../../panflix/img/rating/star0.png) no-repeat 0px center; height: 24px; background-size: 90px; }

/* tooltip提示框 */
.tooltip {
	position: relative;
}

.tooltip:hover::before {
	white-space: nowrap;
	line-height: 20px;
	content: attr(data-msg);
	position: absolute;
	padding: 5px 10px;
	display: block;
	color: #ffffff;
	background: #656565;
	border-radius: 6px;
	font-size: 14px;
	top: -37px;
	left: 50%;
	transform: translateX(-50%);
}

.tooltip:hover::after {
	content: "";
	position: absolute;
	top: -8px;
	left: 50%;
	transform: translateX(-50%);
	border: 6px solid transparent;
	border-top: 6px solid #656565;
}