/**
 * GG旅游攻略生成器 - Huggingface平台兼容性修复
 * 确保主题在Huggingface上正常显示
 */

/* 强制主题应用 - 使用!important增加优先级 */

/* ===== 大气视觉型 ===== */
body.theme-atmospheric {
  background-image: url('https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2970&q=80') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-attachment: fixed !important;
}

body.theme-atmospheric::before {
  content: "" !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.5)) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

body.theme-atmospheric .site-header h1 {
  color: white !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5) !important;
}

body.theme-atmospheric .site-header p {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* ===== 简洁清新型 ===== */
body.theme-clean {
  background-color: #f8f9fa !important;
  background-image: none !important;
}

body.theme-clean .form-card {
  border-top: 4px solid var(--primary-color) !important;
}

/* ===== 文艺复古型 ===== */
body.theme-artistic {
  background-color: var(--warm-beige) !important;
  background-image: url('https://images.unsplash.com/photo-1581512798938-9ac0d6cda0be?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2970&q=80') !important;
  background-size: cover !important;
  background-position: center !important;
  background-attachment: fixed !important;
}

body.theme-artistic .site-header h1 {
  font-family: 'Playfair Display', serif !important;
  color: #5c4f3d !important;
}

body.theme-artistic .site-header p {
  font-family: 'Lora', serif !important;
  color: #847a6a !important;
}

body.theme-artistic .form-card {
  background-color: rgba(245, 240, 229, 0.9) !important;
}

/* ===== 动感潮流型 ===== */
body.theme-dynamic {
  background-color: #181818 !important;
  background-image: url('https://images.unsplash.com/photo-1506197603052-3cc9c3a201bd?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2970&q=80') !important;
  background-size: cover !important;
  background-position: center !important;
  background-attachment: fixed !important;
}

body.theme-dynamic::before {
  content: "" !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(45deg, rgba(142, 68, 173, 0.7), rgba(41, 128, 185, 0.7)) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

body.theme-dynamic .site-header h1 {
  background: linear-gradient(90deg, #8e44ad, #3498db, #ff6b9e) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

body.theme-dynamic .site-header p {
  color: white !important;
}

/* ===== 专业严谨型 ===== */
body.theme-professional {
  background-color: #f5f5f7 !important;
  background-image: none !important;
}

body.theme-professional .site-header h1 {
  color: var(--dark-blue) !important;
}

body.theme-professional .site-header p {
  color: #566a80 !important;
}

body.theme-professional .form-card {
  border-radius: 4px !important;
  border: 1px solid #e5e5e5 !important;
}

/* 侧边历史记录按钮位置固定 */
.history-sidebar {
  position: fixed !important;
  right: 15px !important;
  top: 80% !important;
  transform: translateY(-50%) !important;
  z-index: 9999 !important; /* 高于大多数元素但低于主题切换器 */
  transition: all 0.3s ease !important;
}

.history-tab {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 50px !important;
  height: 50px !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15) !important;
}

/* 主题切换器位置调整 */
.theme-switcher {
  position: fixed !important;
  bottom: 20px !important;
  right: 20px !important;
  z-index: 10000 !important; /* 确保在Gradio UI和历史按钮之上 */
  background-color: rgba(255, 255, 255, 0.9) !important; 
  border-radius: 10px !important;
  padding: 10px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15) !important;
}

/* 确保主题切换器不会与历史按钮重叠 */
@media (max-height: 600px) {
  .theme-switcher {
    bottom: 85px !important; /* 在小屏幕上增加与底部的距离 */
  }
}

/* 修复图标在Huggingface上的显示 */
.theme-btn i,
.history-tab-icon {
  display: inline-block !important;
}

/* Huggingface特定修复 */
.gradio-container {
  background: transparent !important;
}

/* 避免与Huggingface其他样式冲突 */
.gradio-container .theme-btn:hover {
  transform: scale(1.1) !important;
}

/* 确保文本显示正确 */
.theme-switcher-title {
  color: #333 !important;
}

/* 确保在所有浏览器中应用 backdrop-filter */
@supports not (backdrop-filter: blur(10px)) {
  body.theme-atmospheric .form-card {
    background-color: rgba(255, 255, 255, 0.95) !important;
  }
}