/* 全局样式 */
:root {
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --secondary-gradient: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --glass-bg: rgba(17, 25, 40, 0.75);
    --glass-border: rgba(255, 255, 255, 0.125);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background: linear-gradient(to bottom right, #0f172a, #1e1b4b, #0f172a);
    min-height: 100vh;
}

/* 玻璃效果 */
.glass-effect {
    background: var(--glass-bg);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid var(--glass-border);
}

/* 渐变文字 */
.gradient-text {
    background: linear-gradient(135deg, #60a5fa, #a78bfa, #f472b6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* 导航链接 */
.nav-link {
    @apply px-4 py-2 rounded-lg text-gray-300 hover:text-white transition-all duration-300;
    position: relative;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 2px;
    background: var(--primary-gradient);
    transition: width 0.3s ease;
    border-radius: 1px;
}

.nav-link:hover::after,
.nav-link.active::after {
    width: 80%;
}

.nav-link.active {
    @apply text-white font-medium;
}

/* 移动端导航 */
.mobile-nav-link {
    @apply flex items-center px-4 py-3 rounded-lg text-gray-300 hover:text-white hover:bg-white/10 transition-all;
}

.mobile-nav-link.active {
    @apply text-white bg-white/10;
}

/* 统计卡片 */
.stat-card {
    @apply bg-gray-800/50 backdrop-blur-sm rounded-xl p-4 md:p-6 border border-gray-700/50;
    @apply hover:border-gray-600/50 transition-all duration-300 transform hover:-translate-y-1;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.stat-icon {
    @apply w-12 h-12 rounded-xl flex items-center justify-center text-xl flex-shrink-0;
}

.stat-content {
    flex: 1;
    min-width: 0;
}

.stat-number {
    @apply text-2xl md:text-3xl font-bold text-white;
}

.stat-label {
    @apply text-sm text-gray-400 mt-1;
}

/* 新闻卡片 */
.news-card {
    @apply bg-gray-800/50 backdrop-blur-sm rounded-xl border border-gray-700/50 overflow-hidden;
    @apply hover:border-blue-500/50 transition-all duration-300 cursor-pointer;
    @apply transform hover:-translate-y-1 hover:shadow-xl hover:shadow-blue-500/10;
}

.news-card-inner {
    @apply p-5 md:p-6;
}

.news-card-header {
    @apply flex items-center justify-between mb-3;
}

.category-badge {
    @apply inline-flex items-center px-3 py-1 rounded-full text-xs font-semibold;
}

.category-domestic {
    @apply bg-red-500/20 text-red-400 border border-red-500/30;
}

.category-international {
    @apply bg-blue-500/20 text-blue-400 border border-blue-500/30;
}

.category-finance {
    @apply bg-green-500/20 text-green-400 border border-green-500/30;
}

.category-social {
    @apply bg-purple-500/20 text-purple-400 border border-purple-500/30;
}

.source-badge {
    @apply text-xs text-gray-500 flex items-center;
}

.news-title {
    @apply text-lg font-semibold text-white mb-2 line-clamp-2;
    @apply group-hover:text-blue-400 transition-colors;
}

.news-summary {
    @apply text-gray-400 text-sm line-clamp-2 mb-4;
}

.news-footer {
    @apply flex items-center justify-between text-sm text-gray-500;
}

.news-time {
    @apply flex items-center;
}

.news-link {
    @apply text-blue-400 hover:text-blue-300 transition-colors flex items-center;
}

/* 骨架屏 */
.skeleton-card {
    @apply bg-gray-800/50 rounded-xl p-6 border border-gray-700/50;
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}

/* 加载更多按钮 */
.load-more-btn {
    @apply bg-gray-800 hover:bg-gray-700 text-gray-300 hover:text-white;
    @apply px-8 py-3 rounded-full border border-gray-700 hover:border-gray-600;
    @apply transition-all duration-300 transform hover:scale-105;
}

/* 侧边栏 */
.sidebar-card {
    @apply bg-gray-800/50 backdrop-blur-sm rounded-xl border border-gray-700/50 overflow-hidden;
}

.sidebar-header {
    @apply px-6 py-4 text-lg font-semibold text-white flex items-center;
    @apply border-b border-gray-700/50;
}

/* 日期项 */
.date-item {
    @apply flex items-center justify-between px-4 py-3 rounded-lg;
    @apply hover:bg-gray-700/50 cursor-pointer transition-all;
}

.date-item:hover {
    @apply translate-x-1;
}

.date-text {
    @apply text-gray-300;
}

.date-count {
    @apply bg-blue-500/20 text-blue-400 px-2 py-1 rounded-full text-xs font-medium;
}

/* 源标签 */
.source-tag {
    @apply inline-block px-3 py-1 bg-gray-700/50 text-gray-400 text-xs rounded-full;
    @apply hover:bg-gray-600/50 hover:text-gray-300 transition-all cursor-default;
}

/* 日历样式 */
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    text-align: center;
}

.calendar-header {
    @apply text-xs text-gray-500 font-medium py-2;
}

.calendar-day {
    @apply w-8 h-8 flex items-center justify-center rounded-lg text-sm;
    @apply cursor-pointer transition-all duration-200 mx-auto;
}

.calendar-day:hover {
    @apply bg-gray-700;
}

.calendar-day.today {
    @apply bg-blue-600 text-white font-bold;
}

.calendar-day.has-news {
    @apply bg-blue-500/20 text-blue-400 font-medium;
}

.calendar-day.other-month {
    @apply text-gray-600;
}

/* 空状态 */
.empty-state {
    @apply bg-gray-800/30 rounded-2xl p-12;
}

/* 页脚 */
.footer-gradient {
    background: linear-gradient(to top, rgba(0,0,0,0.5), transparent);
}

/* 社交链接 */
.social-link {
    @apply w-10 h-10 rounded-full bg-gray-700/50 flex items-center justify-center;
    @apply text-gray-400 hover:text-white hover:bg-gray-600/50 transition-all;
}

/* 回到顶部按钮 */
#backToTop.visible {
    @apply opacity-100 visible;
}

/* 自定义滚动条 */
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    @apply bg-gray-800 rounded-full;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    @apply bg-gray-600 rounded-full hover:bg-gray-500;
}

/* 响应式优化 */
@media (max-width: 768px) {
    .stat-card {
        @apply p-3;
    }
    
    .stat-icon {
        @apply w-10 h-10 text-lg;
    }
    
    .stat-number {
        @apply text-xl;
    }
    
    .news-card-inner {
        @apply p-4;
    }
    
    .news-title {
        @apply text-base;
    }
}

/* 动画 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.5s ease-out forwards;
}

.news-card {
    animation: fadeInUp 0.5s ease-out forwards;
}

/* 线条装饰 */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
