.friends-forms h1 {
	color: #333;
	margin-bottom: 10px;
	font-size: 28px;
}

.friends-forms .form-subtitle {
	color: #666;
	margin-bottom: 30px;
	font-size: 14px;
}

.friends-forms .form-group {
	margin-bottom: 20px;
}

.friends-forms label {
	display: block;
	margin-bottom: 5px;
	color: #333;
	font-weight: 500;
	font-size: 14px;
}

.friends-forms input[type="text"],
.friends-forms input[type="date"],
.friends-forms input[type="number"],
.friends-forms select {
	width: 100%;
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 14px;
	transition: border-color 0.3s;
}

.friends-forms input[type="text"]:focus,
.friends-forms input[type="date"]:focus,
.friends-forms input[type="number"]:focus,
.friends-forms select:focus {
	outline: none;
	border-color: #602D91;
}

.friends-forms .repeater-section {
	margin-top: 30px;
	padding-top: 30px;
	border-top: 2px solid #f0f0f0;
}

.friends-forms .repeater-section h2 {
	color: #333;
	margin-bottom: 20px;
	font-size: 20px;
}

.friends-forms .repeater-items {
	margin-bottom: 20px;
}

.friends-forms .repeater-item {
	background: #f9f9f9;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
	padding: 20px;
	margin-bottom: 15px;
	position: relative;
}

.friends-forms .repeater-item-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: 1px solid #e0e0e0;
}

.friends-forms .repeater-item-title {
	font-weight: 600;
	color: #555;
	font-size: 15px;
}

.friends-forms .remove-item-btn {
	background: #dc3545;
	color: white;
	border: none;
	padding: 6px 12px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 13px;
	transition: background 0.3s;
}

.friends-forms .remove-item-btn:hover {
	background: #c82333;
}

.friends-forms .repeater-row {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 15px;
	margin-bottom: 15px;
}

.friends-forms .repeater-row-full {
	grid-column: 1 / -1;
}

.friends-forms .form-row {
	display: grid;
	gap: 15px;
	margin-bottom: 15px;
}

.friends-forms .form-row-3 {
	grid-template-columns: repeat(3, 1fr);
}

.friends-forms .form-row .form-group {
	margin-bottom: 0;
}

.friends-forms .checkbox-group {
	display: flex;
	align-items: center;
	gap: 8px;
}

.friends-forms .checkbox-group input[type="checkbox"] {
	width: auto;
	cursor: pointer;
}

.friends-forms .checkbox-group label {
	margin-bottom: 0;
	cursor: pointer;
	font-weight: 400;
}

.friends-forms .add-item-btn {
	background: #602D91;
	color: white;
	border: none;
	padding: 12px 24px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	transition: background 0.3s;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.friends-forms .add-item-btn:hover {
	background: #4a2270;
}

.friends-forms .add-item-btn::before {
	content: "+";
	font-size: 18px;
	font-weight: bold;
}

.friends-forms .submit-btn {
	background: #04823F;
	color: white;
	border: none;
	padding: 14px 32px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 16px;
	font-weight: 500;
	transition: background 0.3s;
}

.friends-forms .submit-btn:hover {
	background: #036830;
}

.friends-forms .submit-btn:disabled {
	background: #6c757d;
	cursor: not-allowed;
}

.friends-forms .form-actions {
	display: flex;
	gap: 15px;
	margin-top: 30px;
	align-items: center;
}

.friends-forms .save-progress-btn {
	background: #F9A01B;
	color: white;
	border: none;
	padding: 14px 32px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 16px;
	font-weight: 500;
	transition: background 0.3s;
}

.friends-forms .save-progress-btn:hover {
	background: #d88a14;
}

.friends-forms .save-progress-btn:disabled {
	background: #6c757d;
	cursor: not-allowed;
}

.friends-forms .message {
	padding: 15px;
	border-radius: 4px;
	margin-bottom: 20px;
	display: none;
}

.friends-forms .message.success {
	background: #d4edda;
	color: #155724;
	border: 1px solid #c3e6cb;
}

.friends-forms .message.error {
	background: #f8d7da;
	color: #721c24;
	border: 1px solid #f5c6cb;
}

.friends-forms .message.show {
	display: block;
}

.friends-forms .loading-spinner {
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 2px solid #ffffff;
	border-radius: 50%;
	border-top-color: transparent;
	animation: spin 0.6s linear infinite;
	margin-left: 10px;
}

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

.friends-forms .instruction-text {
	font-size: 12px;
	color: #666;
	font-style: italic;
	margin-top: 3px;
}

.friends-forms .radio-group {
	display: flex;
	gap: 20px;
	margin-top: 8px;
}

.friends-forms .radio-group label {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 0;
	cursor: pointer;
	font-weight: 400;
}

.friends-forms .radio-group input[type="radio"] {
	width: auto;
	cursor: pointer;
	margin: 0;
}

.friends-forms .receipt-source-selector {
	margin-bottom: 20px;
	padding: 15px;
	background: #f3edf8;
	border-radius: 4px;
	border: 1px solid #c9aee0;
}

.friends-forms .receipt-upload-fields,
.friends-forms .receipt-select-fields {
	margin-top: 15px;
}

.friends-forms .selected-receipt-preview {
	margin-top: 15px;
	padding: 15px;
	background: #f5f0f9;
	border: 1px solid #d8c4e8;
	border-radius: 4px;
}

.friends-forms .preview-info {
	font-size: 14px;
}

.friends-forms .preview-info > div {
	margin: 8px 0;
	color: #555;
}

.friends-forms .preview-info strong {
	font-weight: 600;
	color: #333;
	margin-right: 8px;
}

.friends-forms .preview-info a {
	color: #602D91;
	text-decoration: none;
}

.friends-forms .preview-info a:hover {
	text-decoration: underline;
}

.friends-forms .section-description {
	color: #666;
	font-size: 14px;
	margin-top: -10px;
	margin-bottom: 20px;
	font-style: italic;
}

.friends-forms .receipt-item {
	background: #f9f9f9;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
	padding: 20px;
	margin-bottom: 15px;
	position: relative;
}

.friends-forms .remove-receipt-btn {
	background: #dc3545;
	color: white;
	border: none;
	padding: 6px 12px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 13px;
	transition: background 0.3s;
}

.friends-forms .remove-receipt-btn:hover {
	background: #c82333;
}

.friends-forms .existing-receipt {
	background: #f3edf8;
	border-color: #c9aee0;
}

.friends-forms .existing-receipt-info {
	padding: 10px 0;
}

.friends-forms .receipt-details-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 10px;
	margin-bottom: 10px;
}

.friends-forms .receipt-detail {
	padding: 5px 0;
}

.friends-forms .receipt-description {
	padding: 10px 0;
	border-top: 1px solid #d0bfe5;
	margin-top: 10px;
}

.friends-forms .receipt-file-preview {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #d0bfe5;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.friends-forms .meals-daily-container,
.friends-forms .hotel-daily-container {
	margin-top: 20px;
}

.friends-forms .daily-meal-entry,
.friends-forms .daily-hotel-entry {
	background: #ffffff;
	border: 2px solid #d8c4e8;
	border-radius: 6px;
	padding: 15px;
	margin-bottom: 15px;
}

.friends-forms .daily-meal-header,
.friends-forms .daily-hotel-header {
	background: #f3edf8;
	padding: 10px 15px;
	margin: -15px -15px 15px -15px;
	border-radius: 4px 4px 0 0;
	border-bottom: 2px solid #d8c4e8;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.friends-forms .daily-meal-header strong {
	color: #602D91;
	font-size: 15px;
}

.friends-forms .meal-amounts-row {
	display: flex;
	gap: 10px;
	margin-bottom: 15px;
	align-items: flex-end;
}

.friends-forms .meal-field-compact {
	flex: 0 0 auto;
	min-width: 90px;
	margin-bottom: 0;
}

.friends-forms .meal-field-compact label {
	font-size: 12px;
	margin-bottom: 3px;
	white-space: nowrap;
}

.friends-forms .meal-field-compact input {
	width: 90px;
	padding: 6px 8px;
	font-size: 14px;
	text-align: right;
}

.friends-forms .meal-travel-day-field {
	min-width: 70px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.friends-forms .meal-travel-day-field .checkbox-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 34px;
}

.friends-forms .meal-travel-day-field input[type="checkbox"] {
	width: 18px;
	height: 18px;
	cursor: pointer;
}

.friends-forms .hotel-charges-row,
.friends-forms .personal-charges-row {
	display: flex;
	gap: 10px;
	margin-bottom: 15px;
	align-items: flex-end;
}

.friends-forms .hotel-field-compact {
	flex: 0 0 auto;
	min-width: 110px;
	margin-bottom: 0;
}

.friends-forms .hotel-field-compact label {
	font-size: 12px;
	margin-bottom: 3px;
	white-space: nowrap;
}

.friends-forms .hotel-field-compact input {
	width: 110px;
	padding: 6px 8px;
	font-size: 14px;
	text-align: right;
}

.friends-forms .personal-charges-section {
	background: #f9f9f9;
	border: 1px solid #e0e0e0;
	border-radius: 4px;
	padding: 12px;
	margin: 10px 0;
}

.friends-forms .personal-charges-section h4 {
	margin: 0 0 10px 0;
	font-size: 13px;
	color: #555;
	font-weight: 600;
}

.friends-forms textarea {
	width: 100%;
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 14px;
	font-family: inherit;
	resize: vertical;
	transition: border-color 0.3s;
}

.friends-forms textarea:focus {
	outline: none;
	border-color: #602D91;
}

@media (max-width: 768px) {
	.friends-forms .repeater-row {
		grid-template-columns: 1fr;
	}

	.friends-forms .form-row-3 {
		grid-template-columns: 1fr;
	}

	.friends-forms .container {
		padding: 20px;
	}

	.friends-forms .radio-group {
		flex-direction: column;
		gap: 10px;
	}

	.friends-forms .meal-amounts-row,
	.friends-forms .hotel-charges-row,
	.friends-forms .personal-charges-row {
		flex-wrap: wrap;
	}

	.friends-forms .meal-field-compact,
	.friends-forms .hotel-field-compact {
		flex: 1 1 calc(50% - 5px);
		min-width: 80px;
	}

	.friends-forms .daily-meal-header,
	.friends-forms .daily-hotel-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}
}

/* Navigation Styles */
.friends-forms-navigation {
	background: #f8f9fa;
	border-bottom: 2px solid #602D91;
	margin-bottom: 30px;
	padding: 0;
}

.friends-forms-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0;
}

.friends-forms-navigation li {
	margin: 0;
}

.friends-forms-navigation a {
	display: block;
	padding: 15px 25px;
	color: #333;
	text-decoration: none;
	font-weight: 500;
	transition: all 0.3s ease;
	border-bottom: 3px solid transparent;
}

.friends-forms-navigation a:hover {
	background: #f3edf8;
	color: #602D91;
	border-bottom-color: #602D91;
}

.friends-forms-navigation a.active {
	background: #602D91;
	color: white;
	border-bottom-color: #4a2270;
}

@media (max-width: 768px) {
	.friends-forms-navigation ul {
		flex-direction: column;
	}

	.friends-forms-navigation a {
		border-bottom: none;
		border-left: 3px solid transparent;
		padding: 12px 20px;
	}

	.friends-forms-navigation a:hover,
	.friends-forms-navigation a.active {
		border-left-color: #602D91;
		border-bottom-color: transparent;
	}
}

/* Receipt Library Filters */
.receipt-filters {
	background: #f8f9fa;
	padding: 20px;
	margin-bottom: 20px;
	border-radius: 4px;
	border: 1px solid #ddd;
	display: flex;
	gap: 20px;
	align-items: flex-end;
	flex-wrap: wrap;
}

.receipt-filters .filter-group {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.receipt-filters label {
	font-weight: 500;
	color: #333;
	font-size: 14px;
}

.receipt-filters select,
.receipt-filters input[type="date"] {
	padding: 8px 12px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 14px;
	min-width: 200px;
}

.receipt-filters select:focus,
.receipt-filters input[type="date"]:focus {
	outline: none;
	border-color: #602D91;
}

.receipt-filters .btn {
	padding: 8px 16px;
	font-size: 14px;
	white-space: nowrap;
}

.receipt-filters .btn-secondary {
	background: #6c757d;
	color: white;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: background 0.3s;
}

.receipt-filters .btn-secondary:hover {
	background: #5a6268;
}

@media (max-width: 768px) {
	.receipt-filters {
		flex-direction: column;
		align-items: stretch;
	}

	.receipt-filters .filter-group {
		width: 100%;
	}

	.receipt-filters select,
	.receipt-filters input[type="date"] {
		width: 100%;
		min-width: unset;
	}
}
