.d-attach-list { display: flex; flex-direction: column; gap: 20rpx; } .d-attach-upload { width: 100%; border: 3rpx dashed #9ad9be; border-radius: 28rpx; background: linear-gradient(135deg, rgba(233, 249, 242, 0.95), rgba(255, 255, 255, 0.95)); padding: 28rpx 24rpx; display: flex; align-items: center; gap: 24rpx; } .d-attach-upload:active { border-color: #22c55e; } .d-attach-upload .up-icon { width: 88rpx; height: 88rpx; border-radius: 24rpx; background: linear-gradient(145deg, #4ade80, #22c55e); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 44rpx; box-shadow: 0 12rpx 28rpx rgba(22, 163, 74, 0.28); flex-shrink: 0; } .d-attach-upload .up-text { flex: 1; min-width: 0; } .d-attach-upload .up-title { font-size: 26rpx; font-weight: 700; color: #22c55e; } .d-attach-upload .up-sub { margin-top: 4rpx; font-size: 22rpx; color: #5f7a6d; line-height: 1.4; } .d-attach-card { display: flex; align-items: center; gap: 24rpx; padding: 24rpx; border-radius: 28rpx; background: #fff; border: 1rpx solid #e4eee9; box-shadow: 0 8rpx 28rpx rgba(20, 55, 40, 0.05); position: relative; overflow: hidden; } .d-attach-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 6rpx; background: var(--file-accent, #22c55e); } .d-attach-card.ft-pdf { --file-accent: #ef4444; } .d-attach-card.ft-img { --file-accent: #22c55e; } .d-attach-card.ft-xls { --file-accent: #10b981; } .d-attach-card.ft-doc { --file-accent: #3b82f6; } .d-attach-card.ft-other { --file-accent: #d6a343; } .d-attach-card .file-icon { width: 92rpx; height: 92rpx; border-radius: 26rpx; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2rpx; flex-shrink: 0; color: #fff; font-weight: 800; } .d-attach-card.ft-pdf .file-icon { background: linear-gradient(145deg, #f07171, #ef4444); } .d-attach-card.ft-img .file-icon { background: linear-gradient(145deg, #4ade80, #22c55e); } .d-attach-card.ft-xls .file-icon { background: linear-gradient(145deg, #4fbf8a, #10b981); } .d-attach-card.ft-doc .file-icon { background: linear-gradient(145deg, #6ea8ff, #3b82f6); } .d-attach-card.ft-other .file-icon { background: linear-gradient(145deg, #e4bc6a, #d6a343); } .d-attach-card .file-icon .ext { font-size: 20rpx; letter-spacing: 0.04em; line-height: 1; text-transform: uppercase; } .d-attach-card .file-body { flex: 1; min-width: 0; } .d-attach-card .file-name { font-size: 26rpx; font-weight: 650; color: #173128; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .d-attach-card .file-meta { margin-top: 8rpx; display: flex; flex-wrap: wrap; gap: 16rpx; font-size: 22rpx; color: #8aa198; } .d-attach-card .file-ops { display: flex; flex-direction: column; gap: 12rpx; flex-shrink: 0; } .d-attach-card .file-ops .op-btn { width: 64rpx; height: 64rpx; border-radius: 20rpx; display: flex; align-items: center; justify-content: center; font-size: 32rpx; } .d-attach-card .file-ops .btn-preview { background: var(--brand-green-soft, #ecfdf5); color: var(--brand-green-dark, #16a34a); } .d-attach-card .file-ops .btn-download { background: #f0f5f3; color: #4d635a; } .d-attach-card .file-ops .icon-download { width: 28rpx; height: 28rpx; display: block; }