/* 全局样式 - 印美达 Inkreach 微信小程序 */ page { --color-primary: #ff6800; --color-primary-light: #fff0e5; --color-primary-dark: #e55a00; --color-secondary: #f26522; --color-dark: #121212; --color-text-primary: #333333; --color-text-secondary: #666666; --color-text-tertiary: #999999; --color-bg-page: #f5f5f5; --color-bg-card: #ffffff; --color-border: #eeeeee; --color-tag-bg: #f2f2f2; --color-success: #52c41a; --color-warning: #faad14; --radius-sm: 8rpx; --radius-md: 12rpx; --radius-lg: 20rpx; --radius-xl: 32rpx; --spacing-xs: 8rpx; --spacing-sm: 16rpx; --spacing-md: 24rpx; --spacing-lg: 32rpx; --spacing-xl: 48rpx; font-size: 28rpx; color: var(--color-text-primary); background-color: var(--color-bg-page); font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif; } /* 通用样式 */ .container { min-height: 100vh; background-color: var(--color-bg-page); } .flex-row { display: flex; flex-direction: row; align-items: center; } .flex-col { display: flex; flex-direction: column; } .flex-center { display: flex; align-items: center; justify-content: center; } .flex-between { display: flex; align-items: center; justify-content: space-between; } .flex-1 { flex: 1; } .flex-wrap { display: flex; flex-wrap: wrap; } /* 文字样式 */ .text-primary { color: var(--color-primary); } .text-secondary { color: var(--color-text-secondary); } .text-tertiary { color: var(--color-text-tertiary); } .text-white { color: #ffffff; } .text-bold { font-weight: 600; } .text-center { text-align: center; } .text-sm { font-size: 24rpx; } .text-md { font-size: 28rpx; } .text-lg { font-size: 32rpx; } .text-xl { font-size: 40rpx; } .text-xxl { font-size: 56rpx; } /* 间距 */ .mt-xs { margin-top: 8rpx; } .mt-sm { margin-top: 16rpx; } .mt-md { margin-top: 24rpx; } .mt-lg { margin-top: 32rpx; } .mt-xl { margin-top: 48rpx; } .mb-xs { margin-bottom: 8rpx; } .mb-sm { margin-bottom: 16rpx; } .mb-md { margin-bottom: 24rpx; } .mb-lg { margin-bottom: 32rpx; } .p-sm { padding: 16rpx; } .p-md { padding: 24rpx; } .p-lg { padding: 32rpx; } .px-md { padding-left: 24rpx; padding-right: 24rpx; } .px-lg { padding-left: 32rpx; padding-right: 32rpx; } /* 按钮 */ .btn-primary { display: inline-flex; align-items: center; justify-content: center; background-color: var(--color-primary); color: #ffffff; font-size: 28rpx; font-weight: 500; padding: 20rpx 48rpx; border-radius: var(--radius-lg); border: none; line-height: 1.5; } .btn-primary::after { border: none; } .btn-outline { display: inline-flex; align-items: center; justify-content: center; background-color: transparent; color: var(--color-primary); font-size: 28rpx; font-weight: 500; padding: 20rpx 48rpx; border-radius: var(--radius-lg); border: 2rpx solid var(--color-primary); line-height: 1.5; } .btn-outline::after { border: none; } /* 卡片 */ .card { background-color: var(--color-bg-card); border-radius: var(--radius-md); padding: 24rpx; box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04); } /* 标签 */ .tag { display: inline-flex; align-items: center; padding: 4rpx 16rpx; border-radius: var(--radius-sm); font-size: 20rpx; background-color: var(--color-tag-bg); color: var(--color-text-secondary); } .tag-primary { background-color: var(--color-primary-light); color: var(--color-primary); } /* 分割线 */ .divider { width: 100%; height: 1rpx; background-color: var(--color-border); } /* 安全区底部 */ .safe-bottom { padding-bottom: env(safe-area-inset-bottom); } /* 全局隐藏横向滚动条(scroll-view / webkit) */ ::-webkit-scrollbar { display: none; width: 0; height: 0; background: transparent; }