/* 分类页面统一Tailwind样式 - 用于产品中心和新闻中心 */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* 自定义颜色配置 */
@layer base {
  :root {
    --color-primary: #3B82F6;
    --color-secondary: #64748B;
    --color-light: #F1F5F9;
    --color-dark: #1E293B;
  }
}

/* 通用组件样式 */
@layer components {
  /* 卡片悬停效果 */
  .category-card-hover {
    @apply transition-all duration-300 hover:shadow-md hover:-translate-y-1;
  }
  
  /* 激活状态 */
  .category-active {
    @apply bg-primary text-white;
  }
  
  /* 导航激活状态 */
  .nav-active {
    @apply text-primary border-primary;
  }
  
  /* 产品卡片 */
  .product-card {
    @apply bg-white rounded-lg shadow-sm overflow-hidden category-card-hover;
  }
  
  .product-image {
    @apply aspect-square overflow-hidden bg-gray-100 rounded-lg;
  }
  
  .product-image img {
    @apply w-full h-full object-cover transition-transform duration-500 hover:scale-105;
  }
  
  .product-content {
    @apply p-4;
  }
  
  .product-title {
    @apply font-medium text-gray-800;
  }
  
  .product-link {
    @apply inline-block mt-2 text-primary hover:underline text-sm;
  }
  
  /* 新闻卡片 */
  .news-card {
    @apply bg-white rounded-lg shadow-sm overflow-hidden category-card-hover;
  }
  
  .news-image {
    @apply aspect-video overflow-hidden bg-gray-100;
  }
  
  .news-image img {
    @apply w-full h-full object-cover transition-transform duration-500 hover:scale-105;
  }
  
  .news-content {
    @apply p-4;
  }
  
  .news-title {
    @apply font-medium text-gray-800 mb-2;
  }
  
  .news-date {
    @apply text-gray-600 text-sm mb-3;
  }
  
  .news-excerpt {
    @apply text-gray-600 text-sm mb-4;
  }
  
  .news-link {
    @apply inline-block text-primary hover:underline text-sm;
  }
  
  /* 分类侧边栏 */
  .category-sidebar {
    @apply bg-white rounded-lg shadow-sm p-5 sticky top-4;
  }
  
  .category-sidebar-title {
    @apply text-lg font-semibold mb-4 pb-2 border-b border-gray-200;
  }
  
  .category-list {
    @apply space-y-1;
  }
  
  .category-item {
    @apply block px-4 py-3 rounded-md transition-colors;
  }
  
  .category-item:hover {
    @apply bg-gray-100;
  }
  
  /* 结果统计 */
  .result-stats {
    @apply bg-white rounded-lg shadow-sm p-4 mb-6;
  }
  
  .result-count {
    @apply text-gray-600;
  }
  
  .result-number {
    @apply text-primary font-medium;
  }
  
  /* 网格布局 */
  .category-grid {
    @apply grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6;
  }
  
  /* 分页 */
  .category-pagination {
    @apply mt-10 flex justify-center;
  }
  
  /* 空状态 */
  .empty-state {
    @apply bg-white rounded-lg shadow-sm p-8 text-center;
  }
  
  .empty-text {
    @apply text-gray-600;
  }
}

/* 自定义工具类 */
@layer utilities {
  .content-auto {
    content-visibility: auto;
  }
  
  .line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  
  .line-clamp-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
}

/* 响应式设计 */
@media (max-width: 768px) {
  .category-grid {
    @apply grid-cols-1 gap-4;
  }
  
  .category-sidebar {
    @apply static mb-6;
  }
  
  .product-image,
  .news-image {
    @apply aspect-video;
  }
}

/* 暗色模式支持 */
@media (prefers-color-scheme: dark) {
  .product-card,
  .news-card,
  .category-sidebar,
  .result-stats,
  .empty-state {
    @apply bg-gray-800 border border-gray-700;
  }
  
  .product-title,
  .news-title {
    @apply text-gray-100;
  }
  
  .product-content,
  .news-content,
  .result-count,
  .empty-text {
    @apply text-gray-300;
  }
  
  .category-item:hover {
    @apply bg-gray-700;
  }
}