.confirmation-container { background: white; border-radius: 8px; padding: 3rem 2rem; max-width: 500px; margin: 2rem auto; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); text-align: center; } .confirmation-icon { width: 80px; height: 80px; background: #48bb78; color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 3rem; margin: 0 auto 1.5rem; } .confirmation-container h2 { font-size: 2rem; color: #1a202c; margin-bottom: 2rem; } .confirmation-details { background: #f7fafc; border-radius: 6px; padding: 1.5rem; margin-bottom: 1.5rem; text-align: left; } .detail-row { display: flex; justify-content: space-between; padding: 0.75rem 0; border-bottom: 1px solid #e2e8f0; } .detail-row:last-child { border-bottom: none; } .detail-label { font-weight: 600; color: #4a5568; } .detail-value { color: #2d3748; } .status-badge { background: #48bb78; color: white; padding: 0.25rem 0.75rem; border-radius: 12px; font-size: 0.875rem; font-weight: 600; text-transform: uppercase; } .confirmation-message { color: #718096; margin-bottom: 2rem; line-height: 1.6; } .btn-done { width: 100%; padding: 0.75rem; background: #3182ce; color: white; border: none; border-radius: 6px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background 0.2s; } .btn-done:hover { background: #2c5282; }