/* ========================
   阿龙电竞 - 商家充值页面
   赛博科技风主题 - 完全修复版
   v4.0 - 重点修复文字可见性和整体协调性
======================== */

/* 科技主题色 - 增强对比度 */
:root {
    --primary-color: #ffd061;
    --primary-light: #ffe082;
    --primary-dark: #e6a020;
    --secondary-color: #ffc0a3;
    --accent-color: #e67e22;
    --accent-purple: #ffb74d;
    --dark-bg: #fff8e1;
    --medium-bg: #fff9f0;
    --light-bg: #fff8e1;
    --card-bg: #fef6d4;
    --border-glow: rgba(255, 208, 97, 0.4);
    --text-primary: #222222;
    --text-secondary: #666666;
    --text-highlight: #492f00;
    --text-glow: #e67e22;
    --shadow-tech: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
    --shadow-glow: 0 0 20rpx rgba(255, 208, 97, 0.25);
  }
  
  /* 全局页面样式 - 修复背景 */
  .shangjia-chongzhi-page {
    padding: 20rpx 20rpx 100rpx;
    color: var(--text-primary);
    min-height: 100vh;
    background: linear-gradient(145deg, 
      #f7dc51 0%, 
      #fff8e1 50%, 
      #fff9f0 100%
    ) !important;
    position: relative;
    overflow-x: hidden;
  }
  
  /* 移除过强的毛玻璃效果，只保留轻微模糊 */
  .shangjia-chongzhi-page::before {
    display: none; /* 移除网格背景 */
  }
  
  /* ========== 余额卡片样式 - 完全重写 ========== */
  .balance-card {
    background: #fef6d4; /* 降低透明度，提高文字可见性 */
    border-radius: 25rpx;
    padding: 35rpx 25rpx;
    margin: 0 0 35rpx;
    position: relative;
    overflow: hidden;
    border: 1.5rpx solid rgba(255, 208, 97, 0.3);
    box-shadow: 
      var(--shadow-tech),
      var(--shadow-glow),
      inset 0 0 15rpx rgba(255, 208, 97, 0.08);
    z-index: 1;
    /* 移除或大幅降低毛玻璃效果 */
    backdrop-filter: blur(2px);
  }
  
  /* 余额头部 */
  .balance-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 35rpx;
  }
  
  /* 余额标题 - 确保文字在最上层，完全可见 */
  .balance-title {
    position: relative;
    z-index: 10; /* 确保在最上层 */
  }
  
  .title-text {
    font-size: 38rpx;
    font-weight: 800;
    letter-spacing: 1.5rpx;
    color: var(--text-primary) !important; /* 强制使用白色，确保可见 */
    text-shadow: 
      0 0 15rpx rgba(255, 208, 97, 0.8),
      0 0 30rpx rgba(255, 208, 97, 0.4),
      0 0 45rpx rgba(255, 208, 97, 0.2);
    position: relative;
    display: inline-block;
    /* 移除背景渐变，直接用纯色加阴影 */
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
    filter: brightness(1.2);
  }
  
  /* 标题下划线装饰 */
  .title-decoration {
    display: flex;
    align-items: center;
    margin-top: 12rpx;
  }
  
  .decoration-line {
    width: 50rpx;
    height: 3rpx;
    background: linear-gradient(90deg, 
      transparent, 
      var(--primary-color), 
      transparent
    );
    border-radius: 2rpx;
    animation: lineFlow 2s ease-in-out infinite;
  }
  
  .decoration-dot {
    width: 8rpx;
    height: 8rpx;
    background: var(--secondary-color);
    border-radius: 50%;
    margin: 0 12rpx;
    animation: pulse 1.5s infinite;
    box-shadow: 0 0 8rpx var(--secondary-color);
  }
  
  @keyframes pulse {
    0%, 100% { 
      transform: scale(1); 
      opacity: 1; 
    }
    50% { 
      transform: scale(1.3); 
      opacity: 0.8; 
    }
  }
  
  @keyframes lineFlow {
    0% { background-position: -100% 0; }
    100% { background-position: 200% 0; }
  }
  
  /* VIP商家标签 */
  .balance-chip {
    background: linear-gradient(90deg, 
      rgba(255, 208, 97, 0.15), 
      rgba(255, 42, 109, 0.15)
    );
    border: 1rpx solid rgba(255, 208, 97, 0.3);
    border-radius: 20rpx;
    padding: 10rpx 20rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44rpx;
    min-width: 180rpx;
    box-shadow: 
      0 4rpx 12rpx rgba(255, 208, 97, 0.2),
      inset 0 0 8rpx rgba(255, 208, 97, 0.1);
    position: relative;
    z-index: 10; /* 确保在最上层 */
  }
  
  .chip-text {
    font-size: 24rpx;
    font-weight: 600;
    color: var(--text-primary) !important;
    text-align: center;
    letter-spacing: 1rpx;
    position: relative;
    z-index: 2;
  }
  
  /* 余额金额展示 - 完全重写，确保数字可见 */
  .balance-amount {
    text-align: center;
    margin: 35rpx 0;
    position: relative;
    z-index: 10; /* 确保在最上层 */
  }
  
  .currency {
    font-size: 44rpx;
    font-weight: 800;
    color: var(--accent-color) !important; /* 使用金色，确保可见 */
    margin-right: 8rpx;
    text-shadow: 
      0 0 20rpx rgba(255, 215, 0, 0.7),
      0 0 40rpx rgba(255, 215, 0, 0.4);
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    /* 移除渐变背景，直接用纯色 */
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
  }
  
  .amount {
    font-size: 76rpx;
    font-weight: 900;
    color: var(--text-primary) !important; /* 强制使用白色 */
    line-height: 1;
    text-shadow: 
      0 0 20rpx rgba(255, 208, 97, 0.8),
      0 0 40rpx rgba(255, 208, 97, 0.5),
      0 0 60rpx rgba(255, 208, 97, 0.3);
    letter-spacing: -1.5rpx;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 0 5rpx;
    /* 移除渐变背景，直接用纯色加阴影 */
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
  }
  
  .amount::after {
    display: none; /* 移除模糊效果 */
  }
  
  .unit {
    font-size: 30rpx;
    color: var(--text-secondary);
    margin-left: 8rpx;
    font-weight: 500;
    vertical-align: middle;
    line-height: 1;
  }
  
  /* 余额底部标签 */
  .balance-footer {
    display: flex;
    justify-content: center;
    gap: 30rpx;
    margin-top: 30rpx;
    position: relative;
    z-index: 10;
  }
  
  .balance-tag {
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 208, 97, 0.08);
    padding: 10rpx 22rpx;
    border-radius: 18rpx;
    border: 1rpx solid rgba(255, 208, 97, 0.2);
    min-width: 150rpx;
  }
  
  .tag-text {
    font-size: 24rpx;
    font-weight: 600;
    color: var(--primary-light) !important;
    text-align: center;
    letter-spacing: 1rpx;
  }
  
  /* 机甲装饰元素 - 调低透明度，不干扰文字 */
  .mech-decoration {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 1; /* 在背景层，不在文字上层 */
    opacity: 0.3;
  }
  
  .mech-line {
    position: absolute;
    background: linear-gradient(90deg, 
      transparent 0%, 
      var(--primary-color) 50%, 
      transparent 100%
    );
    opacity: 0.15;
  }
  
  .line-1 {
    top: 15rpx;
    left: 15rpx;
    right: 15rpx;
    height: 1.5rpx;
    animation: lineFlow 3s ease-in-out infinite;
  }
  
  .line-2 {
    bottom: 15rpx;
    left: 15rpx;
    right: 15rpx;
    height: 1.5rpx;
    animation: lineFlow 3s ease-in-out infinite reverse;
  }
  
  .mech-corner {
    position: absolute;
    width: 18rpx;
    height: 18rpx;
    border: 1.5rpx solid var(--primary-color);
    opacity: 0.2;
  }
  
  .corner-1 {
    top: 15rpx;
    left: 15rpx;
    border-right: none;
    border-bottom: none;
    border-top-left-radius: 6rpx;
  }
  
  .corner-2 {
    top: 15rpx;
    right: 15rpx;
    border-left: none;
    border-bottom: none;
    border-top-right-radius: 6rpx;
  }
  
  .corner-3 {
    bottom: 15rpx;
    left: 15rpx;
    border-right: none;
    border-top: none;
    border-bottom-left-radius: 6rpx;
  }
  
  .corner-4 {
    bottom: 15rpx;
    right: 15rpx;
    border-left: none;
    border-top: none;
    border-bottom-right-radius: 6rpx;
  }
  
  /* ========== 充值金额区域 ========== */
  .amount-section {
    background: #fef6d4;
    border-radius: 25rpx;
    padding: 35rpx 25rpx;
    margin-bottom: 35rpx;
    border: 1rpx solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(4px);
    box-shadow: 
      var(--shadow-tech),
      inset 0 0 15rpx rgba(255, 208, 97, 0.05);
    position: relative;
    z-index: 1;
  }
  
  .section-header {
    margin-bottom: 35rpx;
  }
  
  .section-title {
    font-size: 34rpx;
    font-weight: 700;
    color: var(--text-primary) !important;
    display: block;
    margin-bottom: 12rpx;
    letter-spacing: 1rpx;
    text-shadow: 0 0 10rpx rgba(255, 255, 255, 0.2);
    position: relative;
    z-index: 10;
  }
  
  .section-subtitle {
    display: flex;
    align-items: center;
  }
  
  .subtitle-text {
    font-size: 26rpx;
    color: var(--text-secondary);
    position: relative;
    z-index: 10;
  }
  
  /* 快捷金额网格 */
  .quick-amount-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18rpx;
    margin-bottom: 35rpx;
  }
  
  .amount-item {
    background: rgba(255, 255, 255, 0.85);
    border: 2rpx solid rgba(255, 208, 97, 0.35);
    border-radius: 18rpx;
    padding: 26rpx 10rpx;
    text-align: center;
    position: relative;
    transition: all 0.2s ease;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 85rpx;
    overflow: hidden;
  }
  
  .amount-item:active {
    transform: scale(0.96);
  }
  
  .amount-item.active {
    background: linear-gradient(135deg, 
      rgba(250, 224, 77, 0.35), 
      rgba(255, 192, 163, 0.35)
    );
    border-color: var(--primary-color);
    transform: translateY(-3rpx);
    box-shadow: 
      0 10rpx 25rpx rgba(255, 208, 97, 0.2),
      0 0 30rpx rgba(255, 208, 97, 0.1),
      inset 0 0 12rpx rgba(255, 208, 97, 0.1);
  }
  
  .amount-text {
    font-size: 32rpx;
    font-weight: 600;
    color: var(--text-primary) !important;
    position: relative;
    z-index: 10;
    transition: all 0.3s;
  }
  
  .amount-item.active .amount-text {
    color: var(--text-highlight) !important;
    text-shadow: 0 0 10rpx var(--primary-color);
  }
  
  .amount-halo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    height: 90%;
    background: radial-gradient(
      circle at center,
      rgba(255, 208, 97, 0.2) 0%,
      transparent 70%
    );
    border-radius: 50%;
    animation: haloPulse 2s ease-in-out infinite;
    opacity: 0;
    z-index: 1; /* 在文字下面 */
  }
  
  .amount-item.active .amount-halo {
    opacity: 1;
  }
  
  @keyframes haloPulse {
    0%, 100% { 
      opacity: 0.4; 
      transform: translate(-50%, -50%) scale(1); 
    }
    50% { 
      opacity: 0.6; 
      transform: translate(-50%, -50%) scale(1.1); 
    }
  }
  
  /* 自定义金额输入 - 改为线条样式 */
  .custom-amount {
    background: transparent;
    border-radius: 0;
    padding: 0;
    border: none;
    width: 100%;
    box-sizing: border-box;
  }
  
  .custom-input-wrapper {
    position: relative;
    margin-bottom: 20rpx;
    width: 100%;
    padding-bottom: 10rpx;
  }
  
  .input-label {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 42rpx;
    font-weight: 800;
    color: var(--accent-color) !important;
    text-shadow: 0 0 10rpx rgba(255, 215, 0, 0.5);
    z-index: 10;
    padding-left: 10rpx;
  }
  
  .custom-input {
    background: transparent;
    border: none;
    padding: 30rpx 20rpx 30rpx 60rpx;
    font-size: 42rpx;
    font-weight: 800;
    color: var(--text-primary) !important;
    width: 100%;
    text-align: left;
    caret-color: var(--primary-color);
    border-radius: 0;
    border-bottom: 2rpx solid rgba(255, 255, 255, 0.15);
    transition: all 0.3s ease;
    box-sizing: border-box;
    height: 80rpx;
  }
  
  .custom-input:focus {
    border-bottom-color: var(--primary-color);
    box-shadow: 0 0 15rpx rgba(255, 208, 97, 0.3);
  }
  
  .placeholder {
    color: rgba(160, 174, 192, 0.6) !important;
    font-size: 34rpx;
    font-weight: 500;
  }
  
  .input-line {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3rpx;
    background: rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
  }
  
  .input-line.active {
    background: linear-gradient(90deg, 
      var(--primary-color), 
      var(--secondary-color), 
      var(--primary-color)
    );
    height: 3rpx;
    box-shadow: 0 0 15rpx var(--primary-color);
    animation: lineFlash 1.5s ease-in-out infinite;
  }
  
  @keyframes lineFlash {
    0%, 100% { opacity: 0.8; }
    50% { opacity: 1; }
  }
  
  .amount-hint {
    font-size: 24rpx;
    color: var(--text-secondary);
    text-align: center;
    display: block;
    margin-top: 15rpx;
  }
  
  /* ========== 支付按钮区域 ========== */
  .pay-section {
    margin-top: 40rpx;
  }
  
  .pay-button-wrapper {
    width: 100%;
  }
  
  /* 支付按钮 - 修复颜色问题 */
  .pay-button {
    width: 100%;
    height: 100rpx;
    background: linear-gradient(135deg, 
      rgba(100, 116, 139, 0.8), 
      rgba(74, 85, 104, 0.8)
    );
    border-radius: 22rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    border: 1.5rpx solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 10rpx 25rpx rgba(0, 0, 0, 0.4);
  }
  
  /* 激活状态 - 修复为科技蓝渐变 */
  .pay-button.active {
    background: linear-gradient(135deg, 
      #fae04d, 
      #ffc0a3, 
      #ffd061
    );
    border: 1.5rpx solid rgba(255, 208, 97, 0.6);
    box-shadow: 
      0 12rpx 35rpx rgba(255, 208, 97, 0.4),
      0 0 50rpx rgba(255, 208, 97, 0.3),
      inset 0 0 20rpx rgba(255, 208, 97, 0.15);
  }
  
  .pay-button.active:active {
    transform: scale(0.98);
    box-shadow: 
      0 8rpx 25rpx rgba(255, 208, 97, 0.4),
      0 0 35rpx rgba(255, 208, 97, 0.3),
      inset 0 0 15rpx rgba(255, 208, 97, 0.15);
  }
  
  /* 按钮闪光特效 */
  .pay-button-shine {
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(45deg, 
      transparent 30%, 
      rgba(255, 255, 255, 0.2) 50%, 
      transparent 70%
    );
    animation: shine 3s infinite linear;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
  }
  
  .pay-button.active .pay-button-shine {
    opacity: 1;
  }
  
  @keyframes shine {
    0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
    100% { transform: translateX(100%) translateY(100%) rotate(45deg); }
  }
  
  /* 按钮内容 */
  .button-content {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 10; /* 确保按钮文字在最上层 */
    width: 100%;
    height: 100%;
  }
  
  .button-text {
    font-size: 38rpx;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.9);
    letter-spacing: 2rpx;
    text-shadow: 0 0 5rpx rgba(0, 0, 0, 0.5);
  }
  
  .pay-button.active .button-text {
    color: white !important;
    text-shadow: 
      0 0 12rpx rgba(255, 255, 255, 0.8),
      0 0 25rpx rgba(255, 208, 97, 0.6);
  }
  
  /* ========== 支付状态提示 ========== */
  .payment-status {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 248, 225, 0.95);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    backdrop-filter: blur(10rpx);
  }
  
  .status-content {
    background: linear-gradient(135deg, 
      #fff, 
      #fef6d4
    );
    border-radius: 28rpx;
    padding: 60rpx 40rpx;
    text-align: center;
    max-width: 500rpx;
    width: 85%;
    border: 2rpx solid var(--primary-color);
    box-shadow: 
      0 20rpx 50rpx rgba(0, 0, 0, 0.6),
      0 0 50rpx rgba(255, 208, 97, 0.4);
    position: relative;
    overflow: hidden;
    animation: statusAppear 0.3s ease-out;
  }
  
  @keyframes statusAppear {
    0% { opacity: 0; transform: scale(0.9); }
    100% { opacity: 1; transform: scale(1); }
  }
  
  .status-text {
    font-size: 36rpx;
    font-weight: 800;
    color: var(--text-primary) !important;
    display: block;
    margin-bottom: 15rpx;
    text-shadow: 0 0 10rpx rgba(255, 208, 97, 0.6);
    position: relative;
    z-index: 10;
  }
  
  .status-subtext {
    font-size: 28rpx;
    color: var(--text-secondary);
    display: block;
    margin-bottom: 40rpx;
    line-height: 1.4;
    position: relative;
    z-index: 10;
  }
  
  .status-actions {
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 10;
  }
  
  .action-button {
    background: linear-gradient(135deg, #fae04d, #ffd061);
    border-radius: 20rpx;
    padding: 20rpx 40rpx;
    min-width: 200rpx;
    box-shadow: 
      0 8rpx 24rpx rgba(255, 208, 97, 0.4),
      0 0 16rpx rgba(255, 208, 97, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
  }
  
  .action-button:active {
    transform: scale(0.95);
    box-shadow: 
      0 4rpx 12rpx rgba(255, 208, 97, 0.4),
      0 0 8rpx rgba(255, 208, 97, 0.3);
  }
  
  .action-text {
    font-size: 30rpx;
    font-weight: bold;
    color: white;
    text-align: center;
    letter-spacing: 1rpx;
  }
  
  /* ========== 加载遮罩 ========== */
  .loading-mask {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 248, 225, 0.92);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1001;
    backdrop-filter: blur(10rpx);
  }
  
  .loading-content {
    text-align: center;
    animation: loadingFloat 2s ease-in-out infinite;
  }
  
  @keyframes loadingFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12rpx); }
  }
  
  .loading-spinner {
    width: 110rpx;
    height: 110rpx;
    border: 7rpx solid transparent;
    border-top: 7rpx solid var(--primary-color);
    border-right: 7rpx solid var(--secondary-color);
    border-radius: 50%;
    animation: spin 1.5s linear infinite;
    margin: 0 auto 30rpx;
    box-shadow: 
      0 0 20rpx var(--primary-color),
      inset 0 0 12rpx rgba(255, 208, 97, 0.2);
    position: relative;
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
  
  .loading-text {
    font-size: 28rpx;
    color: var(--text-primary);
    text-shadow: 0 0 10rpx rgba(255, 208, 97, 0.6);
    letter-spacing: 1rpx;
  }

  


/* ========== 修复背景颜色和间距 ========== */

/* 1. 橙黄主题背景 */
page {
    background: linear-gradient(180deg, 
      #f7dc51 0%, 
      #fff8e1 50%, 
      #fff9f0 100%
    ) !important;
    height: 100%;
  }
  
  /* 2. 调整页面整体间距 */
  .shangjia-chongzhi-page {
    padding: 20rpx 20rpx 100rpx !important; /* 稍微增加边距 */
    background: transparent !important;
    min-height: 100vh;
  }
  
  /* 3. 调整余额卡片 */
  .balance-card {
    margin: 0 0 30rpx !important; /* 增加下方间距 */
    padding: 35rpx 25rpx !important; /* 增加内边距 */
    border-radius: 25rpx !important;
    background: #fef6d4 !important; /* 调亮背景 */
    border: 1.5rpx solid rgba(255, 208, 97, 0.4) !important; /* 加强边框 */
  }
  
  /* 4. 调整余额字体和颜色 - 确保可见 */
  .balance-amount {
    margin: 30rpx 0 !important;
  }
  
  .currency {
    font-size: 42rpx !important;
    color: #e67e22 !important;
    text-shadow: none !important;
  }
  
  .amount {
    font-size: 72rpx !important;
    color: #222 !important;
    text-shadow: none !important;
  }
  
  .unit {
    font-size: 30rpx !important;
    color: #666 !important;
  }
  
  /* 5. 调整充值金额区域 */
  .amount-section {
    margin-bottom: 30rpx !important;
    padding: 30rpx 25rpx !important;
    border-radius: 25rpx !important;
    background: #fff !important; /* 调亮背景 */
  }
  
  /* 6. 调整快捷金额网格 */
  .quick-amount-grid {
    gap: 18rpx !important;
    margin-bottom: 30rpx !important;
  }
  
  .amount-item {
    min-height: 125rpx !important; /* 增加高度 */
    padding: 25rpx 10rpx !important;
  }
  
  .amount-text {
    font-size: 32rpx !important;
    color: #333 !important;
  }
  
  /* 7. 调整输入区域 - 修复占位符溢出问题 */
  .custom-amount {
    margin-top: 20rpx !important; /* 增加上方间距 */
  }
  
  .custom-input-wrapper {
    margin-bottom: 20rpx !important;
    padding-bottom: 15rpx !important; /* 增加底部间距 */
  }
  
  .custom-input {
    padding: 28rpx 20rpx 28rpx 60rpx !important;
    height: 145rpx !important;
    font-size: 40rpx !important;
    color: #222 !important;
    border-bottom: 2rpx solid rgba(0, 0, 0, 0.12) !important;
  }
  
  .custom-input:focus {
    border-bottom-color: #ffd061 !important;
    box-shadow: 0 0 20rpx rgba(255, 208, 97, 0.4) !important;
  }
  
  .input-label {
    font-size: 40rpx !important;
    color: #e67e22 !important;
    text-shadow: none !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }
  
  .placeholder {
    color: rgba(102, 102, 102, 0.7) !important;
    font-size: 34rpx !important;
    font-weight: 500 !important;
  }
  
  /* 8. 调整按钮区域 */
  .pay-section {
    margin-top: 65rpx !important;
  }
  
  .pay-button {
    height: 100rpx !important; /* 恢复适当高度 */
    border-radius: 22rpx !important;
  }
  
  .pay-button.active {
    background: linear-gradient(135deg, 
      #fae04d,
      #ffc0a3,
      #ffd061
    ) !important;
    border: 1.5rpx solid rgba(255, 208, 97, 0.8) !important;
  }
  
  .button-text {
    font-size: 36rpx !important;
    color: #492f00 !important;
    text-shadow: none !important;
  }
  
  .title-text {
    font-size: 36rpx !important;
    color: #222 !important;
    text-shadow: none !important;
  }
  
  .section-title {
    font-size: 34rpx !important;
    color: #222 !important;
    text-shadow: none !important;
  }
  
  .subtitle-text, 
  .amount-hint {
    color: #666 !important;
    font-size: 26rpx !important;
  }
  
  .chip-text {
    color: #492f00 !important;
    text-shadow: none !important;
  }
  
  .tag-text {
    color: #e67e22 !important;
    text-shadow: none !important;
  }
  
  /* 11. 增强装饰元素可见性（但不干扰文字） */
  .mech-line {
    opacity: 0.25 !important; /* 稍微增强可见性 */
  }
  
  .mech-corner {
    opacity: 0.3 !important; /* 稍微增强可见性 */
  }