/* ========================================
   AirMix Vape - 品牌化样式
   设计目标：打造欧美市场专业品牌网站
   参考：JUUL.com, Vuse.com
   ======================================== */

/* === 全局样式优化 === */
:root {
  --airmix-black: #000000;
  --airmix-white: #FFFFFF;
  --airmix-accent: #00D4AA; /* 科技青绿色 */
  --airmix-orange: #FF6B35; /* CTA强调色 */
  --airmix-gray-100: #F7F7F7;
  --airmix-gray-200: #E5E7EB;
  --airmix-gray-300: #D1D5DB;
  --airmix-gray-600: #6B7280;
  --airmix-gray-900: #111827;
}

/* === Hero区域优化 === */
.wp-block-group.hero-section,
.home .wp-block-group:first-child {
  background: linear-gradient(135deg, var(--airmix-black) 0%, #1a1a1a 100%) !important;
  padding: 120px 20px 100px !important;
  margin: 0 !important;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.wp-block-group.hero-section h1,
.home .wp-block-group:first-child h1 {
  font-size: 64px !important;
  font-weight: 700 !important;
  color: var(--airmix-white) !important;
  line-height: 1.2 !important;
  margin-bottom: 24px !important;
  letter-spacing: -1px;
}

.wp-block-group.hero-section p,
.home .wp-block-group:first-child p {
  font-size: 20px !important;
  color: rgba(255, 255, 255, 0.8) !important;
  max-width: 600px;
  margin: 0 auto 40px !important;
  line-height: 1.6;
}

/* === CTA按钮样式 === */
.wp-block-buttons .wp-block-button__link {
  padding: 16px 48px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  text-transform: none !important;
  letter-spacing: 0.5px;
  transition: all 0.3s ease !important;
}

.wp-block-button:first-child .wp-block-button__link {
  background: var(--airmix-accent) !important;
  color: var(--airmix-white) !important;
}

.wp-block-button:first-child .wp-block-button__link:hover {
  background: #00B894 !important;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(0, 212, 170, 0.3);
}

.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--airmix-white) !important;
  border: 2px solid var(--airmix-white) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--airmix-white) !important;
  color: var(--airmix-black) !important;
}

/* === 产品卡片优化 === */
.wp-block-columns .wp-block-column {
  border: 1px solid var(--airmix-gray-200);
  border-radius: 24px;
  padding: 40px 30px !important;
  transition: all 0.3s ease;
  background: var(--airmix-white);
}

.wp-block-columns .wp-block-column:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

.wp-block-columns .wp-block-column h3 {
  font-size: 24px !important;
  font-weight: 600 !important;
  margin: 20px 0 12px !important;
  color: var(--airmix-gray-900);
}

.wp-block-columns .wp-block-column p {
  color: var(--airmix-gray-600);
  line-height: 1.6;
}

/* === 产品图片占位符优化 === */
.wp-block-columns .wp-block-column .wp-block-image {
  background: linear-gradient(135deg, var(--airmix-gray-100) 0%, var(--airmix-gray-200) 100%);
  border-radius: 16px;
  padding: 40px;
  margin-bottom: 24px !important;
  min-height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* === 标题样式统一 === */
h1, .has-text-align-center {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

h2 {
  font-size: 40px !important;
  font-weight: 700 !important;
  margin-bottom: 16px !important;
  color: var(--airmix-gray-900);
}

h3 {
  font-size: 28px !important;
  font-weight: 600 !important;
  color: var(--airmix-gray-900);
}

/* === Why AirMix 区域优化 === */
.wp-block-group.has-light-gray-background-color {
  background-color: var(--airmix-gray-100) !important;
}

.wp-block-group.has-light-gray-background-color h3 {
  font-size: 24px !important;
  margin-bottom: 12px !important;
}

/* === 导航优化 === */
.wp-block-navigation {
  background: var(--airmix-white) !important;
  padding: 16px 0 !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.wp-block-navigation-item__content {
  font-size: 16px !important;
  font-weight: 500 !important;
  color: var(--airmix-gray-900) !important;
  padding: 8px 16px !important;
}

.wp-block-navigation-item__content:hover {
  color: var(--airmix-accent) !important;
}

/* === Footer优化 === */
.site-footer,
.wp-block-template-part-footer {
  background: var(--airmix-black) !important;
  color: var(--airmix-white) !important;
  padding: 60px 0 40px !important;
}

.site-footer a,
.wp-block-template-part-footer a {
  color: rgba(255, 255, 255, 0.7) !important;
  text-decoration: none;
}

.site-footer a:hover,
.wp-block-template-part-footer a:hover {
  color: var(--airmix-white) !important;
}

/* === 响应式优化 === */
@media (max-width: 768px) {
  .wp-block-group.hero-section h1,
  .home .wp-block-group:first-child h1 {
    font-size: 36px !important;
  }
  
  .wp-block-group.hero-section p,
  .home .wp-block-group:first-child p {
    font-size: 16px !important;
  }
  
  .wp-block-columns {
    flex-direction: column !important;
  }
  
  .wp-block-column {
    margin-bottom: 24px !important;
  }
  
  h2 {
    font-size: 28px !important;
  }
}

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

.wp-block-group.hero-section > * {
  animation: fadeInUp 0.8s ease forwards;
}

.wp-block-group.hero-section > *:nth-child(2) {
  animation-delay: 0.2s;
}

.wp-block-group.hero-section > *:nth-child(3) {
  animation-delay: 0.4s;
}

/* === 页面加载优化 === */
img {
  max-width: 100%;
  height: auto;
}

/* === 表单元素优化 === */
input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
  border: 2px solid var(--airmix-gray-200) !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  font-size: 16px !important;
  transition: border-color 0.3s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border-color: var(--airmix-accent) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(0, 212, 170, 0.1);
}

/* === 购物车图标优化 === */
.wp-block-woocommerce-mini-cart {
  color: var(--airmix-gray-900) !important;
}

.wp-block-woocommerce-mini-cart:hover {
  color: var(--airmix-accent) !important;
}

/* === 品牌Logo优化 === */
.custom-logo-link img,
.wp-block-site-logo img {
  max-height: 40px;
  width: auto;
}

/* === 价格显示优化 === */
.woocommerce-Price-amount {
  color: var(--airmix-accent) !important;
  font-weight: 700 !important;
  font-size: 24px !important;
}

/* === 产品标签优化 === */
.onsale,
.wp-block-woocommerce-product-sale-badge {
  background: var(--airmix-orange) !important;
  color: var(--airmix-white) !important;
  padding: 8px 16px !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
}

/* === 滚动条美化 === */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: var(--airmix-gray-100);
}

::-webkit-scrollbar-thumb {
  background: var(--airmix-gray-300);
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--airmix-gray-600);
}

/* === 隐藏页面列表导航（保留正确的导航菜单）=== */
.wp-block-page-list {
    display: none !important;
}

/* 确保导航菜单显示 */
.wp-block-navigation {
    display: block !important;
}

/* 隐藏重复的导航 */
header .wp-block-navigation + .wp-block-page-list {
    display: none !important;
}
/* 隐藏所有旧的导航和页面列表 */
.wp-block-page-list,
header .wp-block-navigation__container:not([data-ref]) {
    display: none !important;
}

/* 只显示引用了导航菜单ID 4 的导航 */
.wp-block-navigation__container[data-ref="4"],
.wp-block-navigation[ref="4"] {
    display: flex !important;
}
/* ========================================
   导航修复 - 隐藏页面列表，显示正确导航
   ======================================== */

/* 隐藏所有页面列表块 */
.wp-block-page-list {
    display: none !important;
}

/* 隐藏由页面列表生成的所有导航项 */
header .wp-block-page-list,
footer .wp-block-page-list,
.wp-block-group .wp-block-page-list {
    display: none !important;
}

/* 确保导航菜单显示 */
.wp-block-navigation {
    display: block !important;
}

/* 只显示引用了导航菜单ID的导航 */
.wp-block-navigation[ref] {
    display: flex !important;
}

/* 隐藏重复的导航容器 */
.wp-block-group:has(.wp-block-page-list) + .wp-block-group:has(.wp-block-navigation) {
    display: none;
}

/* 强制只显示6个导航项 - 通过nth-child隐藏多余的 */
.wp-block-navigation__container > .wp-block-navigation-item:nth-child(n+7) {
    display: none !important;
}

/* ========================================
   导航修复 - 强制隐藏页面列表，显示正确导航
   ======================================== */

/* 隐藏所有页面列表块 */
.wp-block-page-list,
.wp-block-page-list * {
    display: none !important;
}

/* 强制显示导航菜单 */
.wp-block-navigation {
    display: block !important;
}

/* 隐藏header中的页面列表 */
header .wp-block-page-list,
.wp-block-group .wp-block-page-list {
    display: none !important;
}

/* 确保只显示6个导航项 */
.wp-block-navigation__container > li:nth-child(n+7) {
    display: none !important;
}

/* 隐藏重复的导航容器 */
.wp-block-group:has(.wp-block-page-list) {
    display: none !important;
}