/* Custom Repeater Styles */
.table-repeater-component .choices input {
	min-width: 100% !important;
}

/* Center all header labels */
.table-repeater-header-column {
	text-align: center !important;
}

/* Add this to ensure proper spacing in the table cells */
.table-repeater-column {
	padding: 0.5rem;
	vertical-align: middle;
}

/* Ensure inputs and selects have consistent height */
.table-repeater-column input,
.table-repeater-column .fi-input {
	height: 2.25rem;
}

/* Style select dropdowns to match inputs */
.table-repeater-column select {
	background-position: right 0.5rem center;
	background-repeat: no-repeat;
	background-size: 1.5em 1.5em;
	padding-right: 2.5rem;
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
}

/* Make the action column as small as possible */
.table-repeater-header-column:last-child,
.table-repeater-column:last-child {
	width: 24px !important;
	min-width: 24px !important;
	padding: 0 0 0 4px !important;
}

/* Command (cmdk) styles */
.cmdk {
	width: 100%;
	background: white;
	border-radius: 0.375rem;
}

.cmdk-input {
	width: 100%;
	padding: 0.5rem 0.75rem;
	font-size: 0.875rem;
	border: none;
	outline: none;
}

.cmdk-list {
	max-height: 300px;
	overflow-y: auto;
	padding: 0.25rem;
}

.cmdk-item {
	padding: 0.375rem 0.75rem;
	margin: 0.125rem 0;
	border-radius: 0.25rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.cmdk-item:hover {
	background-color: #f3f4f6;
}

.cmdk-item[aria-selected='true'] {
	background-color: #f3f4f6;
	font-weight: 500;
}

/* Responsive breakpoints */
@media (min-width: 640px) {
	.table-repeater-component.break-point-sm .table-repeater-row {
		border-right-width: 1px;
		border-right-color: rgba(17, 24, 39, 0.05);
	}

	.dark .table-repeater-component.break-point-sm .table-repeater-row {
		border-right-color: rgba(255, 255, 255, 0.2);
	}

	.table-repeater-component.break-point-sm.streamlined .fi-input-wrp,
	.table-repeater-component.break-point-sm.streamlined
		.fi-fo-file-upload
		.filepond--root {
		--tw-ring-offset-shadow: 0 0 #0000;
		--tw-ring-shadow: 0 0 #0000;
		--tw-shadow: 0 0 #0000;
		--tw-shadow-colored: 0 0 #0000;
		background-color: transparent;
		box-shadow:
			var(--tw-ring-offset-shadow, 0 0 #0000),
			var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
	}

	.table-repeater-component.break-point-sm.streamlined
		.fi-fo-field-wrp:has(.fi-fo-checkbox-list),
	.table-repeater-component.break-point-sm.streamlined
		.fi-fo-field-wrp:has(.fi-checkbox-input),
	.table-repeater-component.break-point-sm.streamlined
		.fi-fo-field-wrp:has(.fi-fo-radio) {
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}

	.table-repeater-component.break-point-sm.streamlined
		.fi-fo-field-wrp:has(.fi-fo-toggle) {
		display: inline-block;
		margin-top: 0.25rem;
	}
}

@media (min-width: 768px) {
	.table-repeater-component.break-point-md .table-repeater-row {
		border-right-width: 1px;
		border-right-color: rgba(17, 24, 39, 0.05);
	}

	.dark .table-repeater-component.break-point-md .table-repeater-row {
		border-right-color: rgba(255, 255, 255, 0.2);
	}

	.table-repeater-component.break-point-md.streamlined .fi-input-wrp,
	.table-repeater-component.break-point-md.streamlined
		.fi-fo-file-upload
		.filepond--root {
		--tw-ring-offset-shadow: 0 0 #0000;
		--tw-ring-shadow: 0 0 #0000;
		--tw-shadow: 0 0 #0000;
		--tw-shadow-colored: 0 0 #0000;
		background-color: transparent;
		box-shadow:
			var(--tw-ring-offset-shadow, 0 0 #0000),
			var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
	}

	.table-repeater-component.break-point-md.streamlined
		.fi-fo-field-wrp:has(.fi-fo-checkbox-list),
	.table-repeater-component.break-point-md.streamlined
		.fi-fo-field-wrp:has(.fi-checkbox-input),
	.table-repeater-component.break-point-md.streamlined
		.fi-fo-field-wrp:has(.fi-fo-radio) {
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}

	.table-repeater-component.break-point-md.streamlined
		.fi-fo-field-wrp:has(.fi-fo-toggle) {
		display: inline-block;
		margin-top: 0.25rem;
	}
}

/* Mobile responsive styles */
@media (max-width: 767px) {
	.table-repeater-component.break-point-md table {
		display: block;
		width: 100%;
	}

	.table-repeater-component.break-point-md table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border-width: 0;
	}

	.table-repeater-component.break-point-md table tbody,
	.table-repeater-component.break-point-md table th,
	.table-repeater-component.break-point-md table td {
		display: block;
		width: 100% !important;
	}

	.table-repeater-component.break-point-md table label {
		text-align: start;
	}

	.table-repeater-component.break-point-md table tr {
		padding: 1rem;
		width: 100% !important;
		display: flex;
		flex-direction: column;
		gap: 0.75rem;
	}

	/* Show labels in mobile view using pseudo-elements */
	.table-repeater-component.break-point-md
		table
		.table-repeater-column::before {
		content: attr(data-label);
		display: block;
		font-size: 0.875rem;
		font-weight: 500;
		color: #374151;
		margin-bottom: 0.25rem;
	}

	.dark
		.table-repeater-component.break-point-md
		table
		.table-repeater-column::before {
		color: #d1d5db;
	}

	/* Make the delete button appear at the top right on mobile */
	.table-repeater-component.break-point-md table td:last-child {
		position: absolute;
		top: 0.5rem;
		right: 0.5rem;
		width: auto !important;
	}
}
