/* Basic Style Reset */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	background-color: #f5f5f5;
	color: #333;
	line-height: 1.6;
}

/* Header Styles */
.header {
	background: linear-gradient(135deg, #ff6b35, #f7931e);
	color: white;
	padding: 15px 0;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.header-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 20px;
	max-width: 600px;
	margin: 0 auto;
}

.back-btn, .help-btn {
	background: none;
	border: none;
	color: white;
	font-size: 18px;
	cursor: pointer;
	padding: 10px;
	border-radius: 50%;
	transition: background-color 0.3s ease;
}

.back-btn:hover, .help-btn:hover {
	background-color: rgba(255,255,255,0.2);
}

.header-title {
	font-size: 20px;
	font-weight: 600;
}

/* Progress Bar Styles */
.progress-container {
	margin-top: 70px;
	background: white;
	padding: 20px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.progress-steps {
	display: flex;
	justify-content: space-between;
	max-width: 600px;
	margin: 0 auto;
	position: relative;
}

.progress-steps::before {
	content: '';
	position: absolute;
	top: 20px;
	left: 8%;
	right: 8%;
	height: 2px;
	background-color: #e0e0e0;
	z-index: 1;
}

.step {
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
	z-index: 2;
}

.step-number {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: #e0e0e0;
	color: #666;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	margin-bottom: 8px;
	transition: all 0.3s ease;
}

.step.active .step-number {
	background-color: #ff6b35;
	color: white;
}

.step-text {
	font-size: 14px;
	color: #666;
	text-align: center;
}

.step.active .step-text {
	color: #ff6b35;
	font-weight: 600;
}

/* Main Content Area */
.main-content {
	max-width: 600px;
	margin: 0 auto;
	padding: 20px;
	min-height: calc(100vh - 140px);
}

/* Form Section Styles */
.form-section {
	display: none;
	background: white;
	border-radius: 12px;
	padding: 24px;
	box-shadow: 0 2px 20px rgba(0,0,0,0.06);
}

.form-section.active {
	display: block;
}

.section-title {
	font-size: 24px;
	font-weight: 700;
	color: #333;
	margin-bottom: 8px;
}

.subtitle {
	font-size: 14px;
	color: #666;
	font-weight: 400;
}

.subsection-title {
	font-size: 18px;
	font-weight: 600;
	color: #333;
	margin: 32px 0 16px;
	padding-bottom: 8px;
	border-bottom: 2px solid #ff6b35;
}

/* Applicant Type Selection */
.applicant-type {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin: 24px 0;
}

.type-btn {
	background: #f8f9fa;
	border: 2px solid #e9ecef;
	border-radius: 8px;
	padding: 12px 8px;
	font-size: 14px;
	color: #495057;
	cursor: pointer;
	transition: all 0.3s ease;
	text-align: center;
}

.type-btn:hover {
	border-color: #ff6b35;
	background: #fff5f2;
}

.type-btn.active {
	background: #ff6b35;
	border-color: #ff6b35;
	color: white;
}

/* Patient Type Buttons (similar to type-btn) */
.patient-type {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin: 12px 0;
}

.patient-type-btn {
	background: #f8f9fa;
	border: 2px solid #e9ecef;
	border-radius: 8px;
	padding: 12px 8px;
	font-size: 14px;
	color: #495057;
	cursor: pointer;
	transition: all 0.3s ease;
	text-align: center;
}

.patient-type-btn:hover {
	border-color: #ff6b35;
	background: #fff5f2;
}

.patient-type-btn.active {
	background: #ff6b35;
	border-color: #ff6b35;
	color: white;
}

/* Form Group Styles */
.form-group {
	margin-bottom: 24px;
}

.form-label {
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: #333;
	margin-bottom: 8px;
}

.form-input, .form-select {
	width: 100%;
	padding: 14px 16px;
	border: 2px solid #e9ecef;
	border-radius: 8px;
	font-size: 16px;
	background: #fff;
	transition: border-color 0.3s ease;
}

.form-input:focus, .form-select:focus {
	outline: none;
	border-color: #ff6b35;
	box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1);
}

.form-input::placeholder {
	color: #adb5bd;
}

/* Voice Input and Quick Fill Buttons */
.voice-input-btn, .clear-btn {
	background: #e3f2fd;
	border: 1px solid #2196f3;
	color: #2196f3;
	padding: 6px 12px;
	border-radius: 4px;
	font-size: 12px;
	cursor: pointer;
	margin-top: 8px;
	transition: all 0.3s ease;
}

.voice-input-btn:hover, .clear-btn:hover {
	background: #2196f3;
	color: white;
}

.clear-btn {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	margin-top: 0;
	padding: 4px;
	background: none;
	border: none;
	color: #adb5bd;
	font-size: 14px;
}

.form-group {
	position: relative;
}

/* Payment Method Styles */
.payee-type {
	display: flex;
	gap: 12px;
	margin: 16px 0;
}

.payment-method {
	display: flex;
	justify-content: center;
	margin: 16px 0;
}

.method-option {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #f8f9fa;
	border: 2px solid #e9ecef;
	border-radius: 8px;
	padding: 16px 24px;
	cursor: pointer;
	transition: all 0.3s ease;
}

.method-option:hover {
	border-color: #ff6b35;
	background: #fff5f2;
}

.method-option.active {
	background: #ff6b35;
	border-color: #ff6b35;
	color: white;
}

.method-option i {
	font-size: 20px;
}

/* Bank Card Input */
#bank-card {
	font-family: 'Courier New', monospace;
	letter-spacing: 1px;
}

/* Verification Note */
.verification-note {
	background: #e8f4fd;
	border: 1px solid #b3d7ff;
	border-radius: 8px;
	padding: 16px;
	margin: 24px 0;
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.verification-note i {
	color: #2196f3;
	font-size: 16px;
	margin-top: 2px;
}

.verification-note p {
	color: #1565c0;
	font-size: 14px;
	line-height: 1.5;
	margin: 0;
}

/* Upload Instructions */
.upload-instructions {
	background: #f8f9fa;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 24px;
	border-left: 4px solid #ff6b35;
}

.upload-instructions h4 {
	color: #333;
	margin-bottom: 8px;
	font-size: 16px;
}

.upload-instructions ul {
	margin: 0;
	padding-left: 20px;
	color: #495057;
}

.upload-instructions li {
	margin-bottom: 4px;
	font-size: 14px;
}

.upload-hint {
	font-size: 12px;
	color: #6c757d;
	margin-top: 8px;
}

/* Success Page Styles */
.success-container {
	text-align: center;
	max-width: 600px;
	margin: 0 auto;
	padding: 40px 20px;
}

.success-icon {
	font-size: 80px;
	color: #28a745;
	margin-bottom: 24px;
}

.success-title {
	font-size: 28px;
	font-weight: 700;
	color: #28a745;
	margin-bottom: 12px;
}

.success-subtitle {
	font-size: 16px;
	color: #6c757d;
	margin-bottom: 40px;
	line-height: 1.5;
}

.claim-details {
	background: #f8f9fa;
	border-radius: 12px;
	padding: 24px;
	margin-bottom: 32px;
	text-align: left;
}

.detail-item {
	display: flex;
	align-items: center;
	margin-bottom: 16px;
	padding: 12px;
	background: white;
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.detail-item:last-child {
	margin-bottom: 0;
}

.detail-item i {
	font-size: 20px;
	color: #ff6b35;
	margin-right: 16px;
	width: 24px;
	text-align: center;
}

.detail-content {
	flex: 1;
}

.detail-label {
	display: block;
	font-size: 14px;
	color: #6c757d;
	margin-bottom: 2px;
}

.detail-value {
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: #333;
}

.next-steps {
	background: #e8f4fd;
	border-radius: 12px;
	padding: 24px;
	margin-bottom: 32px;
	text-align: left;
}

.next-steps h3 {
	color: #1565c0;
	font-size: 18px;
	margin-bottom: 16px;
}

.next-steps ul {
	margin: 0;
	padding-left: 20px;
	color: #1565c0;
}

.next-steps li {
	margin-bottom: 8px;
	line-height: 1.4;
}

.action-buttons {
	display: flex;
	gap: 12px;
	justify-content: center;
	margin-top: 32px;
	flex-wrap: wrap;
}

.action-buttons .btn-secondary,
.action-buttons .btn-primary {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 20px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: all 0.3s ease;
	min-width: 140px;
	justify-content: center;
}

.help-placeholder {
	width: 44px;
	height: 44px;
}

/* Helper Text */
.helper-text {
	font-size: 12px;
	color: #6c757d;
	margin-top: 4px;
}

/* Policy Selector */
.policy-selector {
	display: flex;
	border: 2px solid #e9ecef;
	border-radius: 8px;
	overflow: hidden;
}

.policy-btn {
	flex: 1;
	background: #f8f9fa;
	border: none;
	padding: 12px;
	font-size: 14px;
	color: #495057;
	cursor: pointer;
	transition: all 0.3s ease;
}

.policy-btn.active {
	background: #ff6b35;
	color: white;
}

/* Agreement Section */
.agreement-section {
	margin: 32px 0;
	padding: 16px;
	background: #f8f9fa;
	border-radius: 8px;
	border-left: 4px solid #ff6b35;
}

.checkbox-container {
	display: flex;
	align-items: flex-start;
	cursor: pointer;
	font-size: 14px;
	line-height: 1.5;
	color: #495057;
}

.checkbox-container input[type="checkbox"] {
	display: none;
}

.checkmark {
	width: 18px;
	height: 18px;
	border: 2px solid #dee2e6;
	border-radius: 3px;
	margin-right: 12px;
	margin-top: 2px;
	flex-shrink: 0;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}

.checkbox-container input[type="checkbox"]:checked + .checkmark {
	background: #ff6b35;
	border-color: #ff6b35;
}

.checkbox-container input[type="checkbox"]:checked + .checkmark::after {
	content: '✓';
	color: white;
	font-size: 12px;
	font-weight: bold;
}

/* File Upload Area */
.upload-area {
	margin: 24px 0;
}

.upload-zone {
	border: 2px dashed #dee2e6;
	border-radius: 12px;
	padding: 40px 20px;
	text-align: center;
	cursor: pointer;
	transition: all 0.3s ease;
	background: #fafbfc;
}

.upload-zone:hover {
	border-color: #ff6b35;
	background: #fff5f2;
}

.upload-zone i {
	font-size: 48px;
	color: #dee2e6;
	margin-bottom: 16px;
}

.upload-zone:hover i {
	color: #ff6b35;
}

.upload-zone p {
	color: #6c757d;
	font-size: 16px;
}

.upload-zone input[type="file"] {
	display: none;
}

.file-list {
	margin-top: 16px;
}

.file-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 16px;
	background: white;
	border: 1px solid #e9ecef;
	border-radius: 8px;
	margin-bottom: 8px;
}

.file-info {
	display: flex;
	align-items: center;
}

.file-info i {
	font-size: 24px;
	color: #ff6b35;
	margin-right: 12px;
}

.file-name {
	font-weight: 600;
	color: #333;
}

.file-size {
	font-size: 12px;
	color: #6c757d;
	margin-left: 8px;
}

.file-remove {
	background: none;
	border: none;
	color: #dc3545;
	cursor: pointer;
	font-size: 16px;
	padding: 4px;
}

/* Form Action Buttons */
.form-actions {
	display: flex;
	gap: 16px;
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid #e9ecef;
}

.btn-secondary, .btn-primary {
	flex: 1;
	padding: 16px 24px;
	border: none;
	border-radius: 8px;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
}

.btn-secondary {
	background: #f8f9fa;
	color: #495057;
	border: 2px solid #e9ecef;
}

.btn-secondary:hover {
	background: #e9ecef;
	border-color: #adb5bd;
}

.btn-primary {
	background: #ff6b35;
	color: white;
}

.btn-primary:hover {
	background: #e55a2b;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(255, 107, 53, 0.3);
}

.btn-primary:disabled {
	background: #adb5bd;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

/* Responsive Design */
@media (max-width: 768px) {
	.main-content {
		padding: 16px;
	}
    
	.form-section {
		padding: 20px;
	}
    
	.applicant-type, .payee-type {
		grid-template-columns: repeat(2, 1fr);
	}
    
	.form-actions {
		flex-direction: column;
	}
    
	.header-content {
		padding: 0 16px;
	}
}

/* Animation Effects */
@keyframes slideIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.form-section.active {
	animation: slideIn 0.5s ease-out;
}

/* Loading State */
.loading {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 3px solid rgba(255,255,255,.3);
	border-radius: 50%;
	border-top-color: #fff;
	animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
	to { transform: rotate(360deg); }
}

/* Mobile responsiveness for success page action buttons */
@media (max-width: 768px) {
	.action-buttons {
		flex-direction: column;
		gap: 16px;
		padding: 0 20px;
	}
    
	.action-buttons .btn-secondary,
	.action-buttons .btn-primary {
		min-width: 100%;
		justify-content: center;
	}
}

/* Incident buttons */
.incident-options {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.incident-btn {
	background: #f8f9fa;
	border: 1px solid #e9ecef;
	padding: 8px 12px;
	border-radius: 8px;
	cursor: pointer;
}
.incident-btn.active {
	background: #ff6b35;
	color: #fff;
	border-color: #ff6b35;
}
.incident-extra { background: #fff; padding: 12px; border-radius: 8px; margin-top: 12px; border:1px solid #eef0f2 }

/* Modal */
.modal {
	position: fixed;
	left: 0; right: 0; top: 0; bottom: 0;
	background: rgba(0,0,0,0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2000;
}
.modal-content {
	background: #fff;
	padding: 20px;
	border-radius: 12px;
	width: min(700px, 94%);
	max-height: 90vh;
	overflow: auto;
	position: relative;
}
.modal-close { position:absolute; right:12px; top:8px; background:none; border:none; font-size:22px; cursor:pointer }
.claim-preview { white-space:pre-wrap; font-family:monospace; background:#f8f9fa; padding:12px; border-radius:8px; }
.signature-area { margin-top:12px }
#signature-canvas { width:100%; border:1px solid #e9ecef; border-radius:8px; touch-action: none }
.signature-actions { display:flex; gap:12px; justify-content:flex-end; margin-top:12px }

/* Claim preview table */
.claim-table { width:100%; border-collapse: collapse; margin-top:8px }
.claim-table td { padding:8px 10px; border-bottom:1px solid #f0f0f0 }
.claim-key { width:40%; font-weight:700; color:#333; background:#fafafa }
.claim-value { color:#555 }

/* Form Group Styles */
.form-group {
	margin-bottom: 24px;
}

.form-label {
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: #333;
	margin-bottom: 8px;
}

.form-input, .form-select {
	width: 100%;
	padding: 14px 16px;
	border: 2px solid #e9ecef;
	border-radius: 8px;
	font-size: 16px;
	background: #fff;
	transition: border-color 0.3s ease;
}

.form-input:focus, .form-select:focus {
	outline: none;
	border-color: #ff6b35;
	box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1);
}

.form-input::placeholder {
	color: #adb5bd;
}

/* Voice Input and Quick Fill Buttons */
.voice-input-btn, .clear-btn {
	background: #e3f2fd;
	border: 1px solid #2196f3;
	color: #2196f3;
	padding: 6px 12px;
	border-radius: 4px;
	font-size: 12px;
	cursor: pointer;
	margin-top: 8px;
	transition: all 0.3s ease;
}

.voice-input-btn:hover, .clear-btn:hover {
	background: #2196f3;
	color: white;
}

.clear-btn {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	margin-top: 0;
	padding: 4px;
	background: none;
	border: none;
	color: #adb5bd;
	font-size: 14px;
}

.form-group {
	position: relative;
}

/* Payment Method Styles */
.payee-type {
	display: flex;
	gap: 12px;
	margin: 16px 0;
}

.payment-method {
	display: flex;
	justify-content: center;
	margin: 16px 0;
}

.method-option {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	border: 1px solid #e6e9ee;
	border-radius: 10px;
	padding: 12px 18px;
	cursor: pointer;
	transition: all 0.18s ease;
}

.method-option:hover { transform: translateY(-2px); border-color: #ff8a4d; }

.method-option.active { background: linear-gradient(135deg,#ff7a3d,#ff6b35); color: #fff; box-shadow: 0 6px 18px rgba(255,107,53,0.18); }

.method-option i {
	font-size: 20px;
}

/* Bank Card Input */
#bank-card {
	font-family: 'Courier New', monospace;
	letter-spacing: 1px;
}

/* Verification Note */
.verification-note {
	background: #e8f4fd;
	border: 1px solid #b3d7ff;
	border-radius: 8px;
	padding: 16px;
	margin: 24px 0;
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.verification-note i {
	color: #2196f3;
	font-size: 16px;
	margin-top: 2px;
}

.verification-note p {
	color: #1565c0;
	font-size: 14px;
	line-height: 1.5;
	margin: 0;
}

/* Upload Instructions */
.upload-instructions {
	background: #fff;
	border-radius: 10px;
	padding: 16px;
	margin-bottom: 24px;
	border-left: 4px solid #ff8a4d;
}

.upload-instructions h4 {
	color: #333;
	margin-bottom: 8px;
	font-size: 16px;
}

.upload-instructions ul {
	margin: 0;
	padding-left: 20px;
	color: #495057;
}

.upload-instructions li {
	margin-bottom: 4px;
	font-size: 14px;
}

.upload-hint {
	font-size: 12px;
	color: #6c757d;
	margin-top: 8px;
}

/* Success Page Styles */
.success-container {
	text-align: center;
	max-width: 600px;
	margin: 0 auto;
	padding: 40px 20px;
}

.success-icon {
	font-size: 80px;
	color: #28a745;
	margin-bottom: 24px;
}

.success-title {
	font-size: 28px;
	font-weight: 700;
	color: #28a745;
	margin-bottom: 12px;
}

.success-subtitle {
	font-size: 16px;
	color: #6c757d;
	margin-bottom: 40px;
	line-height: 1.5;
}

.claim-details {
	background: #ffffff;
	border-radius: 12px;
	padding: 22px 26px;
	margin: 20px auto 32px;
	text-align: left;
	box-shadow: 0 8px 30px rgba(16,24,40,0.04);
	max-width: 520px;
}

.claim-details .claim-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.claim-details .claim-list li {
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 10px 0;
	border-bottom: 1px dashed #f1f3f5;
	font-size: 14px;
	color: #344054;
}

.claim-details .claim-list li:last-child { border-bottom: none; }

.claim-details .claim-list li i { color: #4b5563; min-width: 20px; }

.success-subtitle { color: #6b7280; font-size: 15px; margin-bottom: 18px; }

.what-next {
	margin-top: 10px;
	text-align: left;
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
}

.what-next h4 { font-size: 18px; margin-bottom: 8px; }

.what-next ul { margin-left: 22px; color: #475569; line-height: 1.7; }

/* Message styles */
.message {
	display: flex;
	align-items: center;
	gap: 8px;
}

/* File list */
.file-list {
	margin-top: 12px;
}

.upload-area {
	display: flex;
	gap: 20px;
	align-items: flex-start;
}

.upload-zone {
	width: 260px;
	min-height: 160px;
	border: 1px dashed #e3e8ee;
	border-radius: 10px;
	background: linear-gradient(180deg,#ffffff,#fbfbfc);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 18px;
	cursor: pointer;
}

.upload-zone i { font-size: 36px; color: #9aa4b2; }

.upload-zone p { color: #4b5563; font-size: 15px; margin: 0; }

.upload-zone input[type=file] { display: none; }

.upload-btn {
	display: inline-block;
	background: linear-gradient(135deg,#ff7a3d,#ff6b35);
	color: #fff;
	padding: 10px 16px;
	border-radius: 8px;
	border: none;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(255,107,53,0.18);
}
.file-remove {
	background: none;
	border: none;
	color: #dc3545;
	cursor: pointer;
}

/* Responsive */
@media (max-width: 640px) {
	.main-content, .header-content, .progress-steps { max-width: 100%; padding: 0 12px; }
	.applicant-type { grid-template-columns: repeat(2, 1fr); }
}

/* Utility buttons */
.btn-primary {
	background: linear-gradient(135deg,#ff7a3d,#ff6b35);
	color: white;
	padding: 12px 20px;
	border: none;
	border-radius: 10px;
	cursor: pointer;
	box-shadow: 0 8px 24px rgba(255,107,53,0.16);
}

.btn-secondary {
	background: #ffffff;
	color: #2b2f36;
	padding: 12px 20px;
	border: 1px solid #e6e9ee;
	border-radius: 10px;
	cursor: pointer;
}

/* Modal improvements */
.modal {
	position: fixed;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1200;
	background: rgba(8,12,20,0.45);
}

.modal-content {
	background: #fff;
	border-radius: 12px;
	padding: 20px 22px;
	width: 95%;
	max-width: 820px;
	box-shadow: 0 20px 50px rgba(16,24,40,0.2);
}

.modal-close {
	background: none;
	border: none;
	font-size: 22px;
	position: absolute;
	right: 20px;
	top: 18px;
	cursor: pointer;
	color: #6b7280;
}

.signature-area { margin-top: 18px; display:flex; flex-direction:column; gap:12px; }
.signature-area canvas { width:100%; height:160px; border-radius:8px; border:1px solid #e6e9ee; background:#fff; }
.signature-actions { display:flex; gap:10px; justify-content:flex-end; }

.claim-table { width: 100%; border-collapse: collapse; }
.claim-key { font-weight: 700; padding: 8px; width: 40%; }
.claim-value { padding: 8px; }

/* Small, non-intrusive overrides: keep the original look but improve only the text layout
   for the success page and upload page. These rules are intentionally minimal and
   won't change component structure or core button styles. */

/* Success page: tighten the card and improve list readability */
.claim-details {
	background: #f8f9fa; /* keep original soft background */
	border-radius: 10px;
	padding: 18px;
	margin-bottom: 24px;
	text-align: left;
}
.claim-details .claim-list, .what-next ul {
	margin: 0;
	padding-left: 18px;
	color: #374151;
	line-height: 1.65;
}
.what-next { max-width: 720px; margin: 12px auto; }

/* Upload area: keep current structure but make file list compact and aligned */
.upload-area { gap: 18px; }
.upload-zone { min-height: 140px; padding: 16px; }
.file-list { margin-top: 12px; display:flex; flex-direction:column; gap:8px; }
.file-item { display:flex; gap:12px; align-items:center; padding:10px; border-radius:8px; background:#fff; border:1px solid #eef2f5; }
.file-meta { display:flex; flex-direction:column; }
.file-name { font-weight:600; font-size:14px; color:#0f172a; }
.file-size { font-size:12px; color:#6b7280; }

/* Keep responsive fallback minimal */
@media (max-width:640px) {
	.upload-area { flex-direction: column; }
	.upload-zone { width:100%; }
}

/* Enhanced styling for "What happens next?" section */
.next-steps {
    margin: 30px auto;
    padding: 25px;
    max-width: 720px;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border-radius: 12px;
    border-left: 4px solid #28a745;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.next-steps h3 {
    margin: 0 0 20px 0;
    color: #2c3e50;
    font-size: 1.25em;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.next-steps h3::before {
    content: "📋";
    font-size: 1.1em;
}

.next-steps ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.next-steps li {
    margin: 15px 0;
    padding: 12px 15px;
    color: #495057;
    line-height: 1.6;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 8px;
    transition: all 0.2s ease;
}

.next-steps li:hover {
    background: rgba(40, 167, 69, 0.05);
    transform: translateX(2px);
}

.next-steps li::before {
    content: "✓";
    color: #28a745;
    font-weight: bold;
    font-size: 16px;
    margin-top: 2px;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    background: rgba(40, 167, 69, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}