/* EDI 在线交易模块样式 */
.trade-page { padding: 16px 0 40px; }
.trade-hero { background: linear-gradient(135deg, #1e40af, #2563eb); color: #fff; border-radius: 12px; padding: 32px 28px; margin-bottom: 24px; }
.trade-hero h1 { font-size: 26px; margin-bottom: 8px; }
.trade-hero p { opacity: .92; margin-bottom: 16px; }
.trade-hero-links { display: flex; gap: 12px; flex-wrap: wrap; }
.btn-trade { display: inline-block; padding: 10px 20px; background: #2563eb; color: #fff !important; border-radius: 8px; text-decoration: none; border: none; cursor: pointer; font-size: 14px; }
.btn-trade:hover { background: #1d4ed8; }
.btn-trade.outline { background: transparent; border: 1px solid #2563eb; color: #2563eb !important; }
.trade-hero .btn-trade.outline { border-color: #fff; color: #fff !important; }
.btn-trade.sm { padding: 6px 12px; font-size: 13px; }
.btn-trade.lg { padding: 14px 28px; font-size: 16px; }
.btn-link { background: none; border: none; color: #2563eb; cursor: pointer; text-decoration: underline; font-size: inherit; }
.page-title { font-size: 22px; margin-bottom: 20px; color: #1e293b; }
.shop-search { display: flex; gap: 8px; margin-bottom: 20px; }
.shop-search input { flex: 1; max-width: 400px; padding: 10px 14px; border: 1px solid #cbd5e1; border-radius: 8px; }
.shop-search button { padding: 10px 20px; background: #2563eb; color: #fff; border: none; border-radius: 8px; cursor: pointer; }
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
@media (max-width: 900px) { .product-grid { grid-template-columns: repeat(2, 1fr); } }
.product-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; overflow: hidden; transition: box-shadow .2s; }
.product-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.product-thumb { display: block; height: 160px; overflow: hidden; background: #f8fafc; }
.product-thumb img { width: 100%; height: 100%; object-fit: cover; }
.product-body { padding: 12px; }
.product-shop { font-size: 12px; color: #64748b; margin-bottom: 4px; }
.product-body h3 { font-size: 14px; margin-bottom: 6px; line-height: 1.4; }
.product-body h3 a { color: #1e293b; text-decoration: none; }
.product-summary { font-size: 12px; color: #64748b; margin-bottom: 8px; }
.product-price { color: #dc2626; font-weight: 700; font-size: 16px; margin-bottom: 8px; }
.product-price.lg { font-size: 24px; }
.product-detail { display: flex; gap: 24px; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 24px; margin-bottom: 24px; }
.product-detail-img { flex: 0 0 360px; }
.product-detail-img img { width: 100%; border-radius: 8px; }
.product-detail-info { flex: 1; }
.product-detail-info h1 { font-size: 22px; margin: 8px 0 12px; }
.buy-form { margin: 16px 0; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.trade-badges span { display: inline-block; background: #eff6ff; color: #2563eb; font-size: 12px; padding: 4px 10px; border-radius: 20px; margin-right: 8px; margin-top: 12px; }
.trade-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 8px; overflow: hidden; margin-bottom: 16px; }
.trade-table th, .trade-table td { padding: 10px 12px; border-bottom: 1px solid #e2e8f0; text-align: left; font-size: 14px; }
.trade-table th { background: #f8fafc; font-weight: 600; }
.cart-total { text-align: right; font-size: 18px; margin: 16px 0; }
.cart-actions { text-align: right; display: flex; gap: 12px; justify-content: flex-end; }
.checkout-grid { display: grid; grid-template-columns: 1fr 360px; gap: 24px; }
@media (max-width: 800px) { .checkout-grid { grid-template-columns: 1fr; } .product-detail { flex-direction: column; } }
.checkout-form { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 20px; }
.checkout-form .form-group { margin-bottom: 14px; }
.checkout-form label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.checkout-form input, .checkout-form textarea { width: 100%; padding: 8px 12px; border: 1px solid #cbd5e1; border-radius: 8px; }
.checkout-note { font-size: 13px; color: #64748b; margin: 12px 0; line-height: 1.6; }
.pay-box { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 32px; max-width: 520px; margin: 0 auto; text-align: center; }
.pay-amount { color: #dc2626; font-size: 28px; }
.pay-success { color: #16a34a; font-weight: 600; margin: 16px 0; }
.form-error { color: #dc2626; background: #fef2f2; padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; }
.form-success { color: #16a34a; background: #f0fdf4; padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; }
.empty-tip { text-align: center; color: #64748b; padding: 40px; }
.merchant-nav { margin-bottom: 20px; }
.merchant-nav a { margin-right: 16px; color: #2563eb; text-decoration: none; }
.merchant-nav a.active { font-weight: 700; }
.merchant-form .form-group { margin-bottom: 14px; }
.merchant-form label { display: block; font-weight: 600; font-size: 13px; margin-bottom: 4px; }
.merchant-form input, .merchant-form textarea { width: 100%; max-width: 560px; padding: 8px 12px; border: 1px solid #cbd5e1; border-radius: 8px; }
.merchant-form-wrap { background: #f8fafc; padding: 20px; border-radius: 12px; margin-bottom: 24px; }
.platform-intro { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 20px; margin-bottom: 24px; line-height: 1.8; }
.stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 24px; }
.stat-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 20px; text-align: center; }
.stat-card .num { font-size: 28px; font-weight: 700; color: #2563eb; }
.stat-card .label { font-size: 13px; color: #64748b; margin-top: 4px; }
.auth-page { max-width: 440px; margin: 0 auto; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 28px; }
.auth-hint { font-size: 13px; color: #64748b; margin-bottom: 16px; line-height: 1.6; }
.auth-switch { text-align: center; margin-top: 16px; font-size: 13px; }
.pagination { text-align: center; margin-top: 24px; }
.pagination a { display: inline-block; padding: 6px 12px; margin: 0 4px; border: 1px solid #e2e8f0; border-radius: 6px; text-decoration: none; color: #334155; }
.pagination a.current { background: #2563eb; color: #fff; border-color: #2563eb; }