
	.picker-container.svelte-s8mqj7 {
		position: fixed;
		z-index: 9999;
		box-shadow: var(--shadow-drop-lg);
		border-radius: var(--radius-lg);
		background: var(--background-fill-primary);
		border: 1px solid var(--border-color-primary);
	}

	.picker.svelte-s8mqj7 {
		padding: var(--size-3);
		min-width: 280px;
	}

	.picker-header.svelte-s8mqj7 {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: var(--size-3);
	}

	.nav-button.svelte-s8mqj7 {
		background: none;
		border: none;
		font-size: var(--text-lg);
		padding: var(--size-1);
		border-radius: var(--radius-sm);
		transition: var(--button-transition);
		cursor: pointer;
		color: var(--body-text-color-subdued);
	}

	.nav-button.svelte-s8mqj7:hover {
		background: var(--button-secondary-background-fill-hover);
		color: var(--body-text-color);
	}

	.month-year.svelte-s8mqj7 {
		font-weight: var(--weight-semibold);
		font-size: var(--text-base);
		color: var(--body-text-color);
	}

	.calendar-grid.svelte-s8mqj7 {
		margin-bottom: var(--size-3);
	}

	.weekdays.svelte-s8mqj7 {
		display: grid;
		grid-template-columns: repeat(7, 1fr);
		gap: 1px;
		margin-bottom: var(--size-2);
	}

	.weekday.svelte-s8mqj7 {
		text-align: center;
		font-size: var(--text-sm);
		font-weight: var(--weight-semibold);
		color: var(--body-text-color-subdued);
		padding: var(--size-1);
	}

	.days.svelte-s8mqj7 {
		display: grid;
		grid-template-columns: repeat(7, 1fr);
		gap: 1px;
	}

	.day.svelte-s8mqj7 {
		aspect-ratio: 1;
		border: none;
		background: none;
		border-radius: var(--radius-sm);
		font-size: var(--text-sm);
		transition: var(--button-transition);
		color: var(--body-text-color);
		cursor: pointer;
	}

	.day.svelte-s8mqj7:hover {
		background: var(--button-secondary-background-fill-hover);
	}

	.day.other-month.svelte-s8mqj7 {
		color: var(--body-text-color-subdued);
	}

	.day.selected.svelte-s8mqj7 {
		background: var(--button-primary-background-fill);
		color: var(--button-primary-text-color);
	}

	.day.selected.svelte-s8mqj7:hover {
		background: var(--button-primary-background-fill-hover);
	}

	.time-picker.svelte-s8mqj7 {
		border-top: 1px solid var(--border-color-primary);
		padding-top: var(--size-3);
		margin-bottom: var(--size-3);
	}

	.time-inputs.svelte-s8mqj7 {
		display: flex;
		gap: var(--size-2);
		justify-content: center;
	}

	.time-input-group.svelte-s8mqj7 {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--size-1);
	}

	.time-input-group.svelte-s8mqj7 label:where(.svelte-s8mqj7) {
		font-size: var(--text-xs);
		color: var(--body-text-color-subdued);
		font-weight: var(--weight-semibold);
	}

	.am-pm-label.svelte-s8mqj7 {
		font-size: var(--text-xs);
		color: var(--body-text-color-subdued);
		font-weight: var(--weight-semibold);
	}

	.time-input-group.svelte-s8mqj7 input:where(.svelte-s8mqj7) {
		width: 50px;
		padding: var(--size-1);
		border: 1px solid var(--input-border-color);
		border-radius: var(--radius-sm);
		text-align: center;
		font-size: var(--text-sm);
		background: var(--input-background-fill);
		color: var(--body-text-color);
	}

	.time-input-group.svelte-s8mqj7 input:where(.svelte-s8mqj7):focus {
		outline: none;
		border-color: var(--input-border-color-focus);
		box-shadow: var(--input-shadow-focus);
	}

	.am-pm-toggle.svelte-s8mqj7 {
		width: 50px;
		padding: var(--size-1);
		border: 1px solid var(--button-primary-border-color);
		border-radius: var(--radius-sm);
		text-align: center;
		font-size: var(--text-sm);
		background: var(--button-primary-background-fill);
		color: var(--button-primary-text-color);
		cursor: pointer;
		transition: var(--button-transition);
	}

	.am-pm-toggle.svelte-s8mqj7:hover {
		background: var(--button-primary-background-fill-hover);
		border-color: var(--button-primary-border-color-hover);
	}

	.am-pm-toggle.svelte-s8mqj7:focus {
		outline: none;
		border-color: var(--button-primary-border-color-focus);
		box-shadow: var(--button-primary-shadow-focus);
	}

	.picker-actions.svelte-s8mqj7 {
		display: flex;
		gap: var(--size-2);
		justify-content: space-between;
		align-items: center;
		border-top: 1px solid var(--border-color-primary);
		padding-top: var(--size-3);
	}

	.picker-actions-right.svelte-s8mqj7 {
		display: flex;
		gap: var(--size-2);
	}

	.action-button.svelte-s8mqj7 {
		padding: var(--size-1) var(--size-3);
		border: 1px solid var(--button-secondary-border-color);
		border-radius: var(--radius-sm);
		background: var(--button-secondary-background-fill);
		color: var(--button-secondary-text-color);
		font-size: var(--text-sm);
		transition: var(--button-transition);
		cursor: pointer;
	}

	.action-button.svelte-s8mqj7:hover {
		background: var(--button-secondary-background-fill-hover);
		border-color: var(--button-secondary-border-color-hover);
	}

	.label-content.svelte-16sct4k {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}

	button.svelte-16sct4k {
		cursor: pointer;
		color: var(--body-text-color-subdued);
	}

	button.svelte-16sct4k:hover {
		color: var(--body-text-color);
	}

	.svelte-16sct4k::placeholder {
		color: var(--input-placeholder-color);
	}

	.timebox.svelte-16sct4k {
		flex-grow: 1;
		flex-shrink: 1;
		display: flex;
		position: relative;
		background: var(--input-background-fill);
	}

	.timebox.svelte-16sct4k svg {
		height: 18px;
	}

	.time.svelte-16sct4k {
		padding: var(--input-padding);
		color: var(--body-text-color);
		font-weight: var(--input-text-weight);
		font-size: var(--input-text-size);
		line-height: var(--line-sm);
		outline: none;
		flex-grow: 1;
		background: none;
		border: var(--input-border-width) solid var(--input-border-color);
		border-right: none;
		border-top-left-radius: var(--input-radius);
		border-bottom-left-radius: var(--input-radius);
		box-shadow: var(--input-shadow);
	}

	.time.svelte-16sct4k:disabled {
		border-right: var(--input-border-width) solid var(--input-border-color);
		border-top-right-radius: var(--input-radius);
		border-bottom-right-radius: var(--input-radius);
	}

	.time.invalid.svelte-16sct4k {
		color: var(--body-text-color-subdued);
	}

	.calendar.svelte-16sct4k {
		display: inline-flex;
		justify-content: center;
		align-items: center;
		transition: var(--button-transition);
		box-shadow: var(--button-primary-shadow);
		text-align: center;
		background: var(--button-secondary-background-fill);
		color: var(--button-secondary-text-color);
		font-weight: var(--button-large-text-weight);
		font-size: var(--button-large-text-size);
		border-top-right-radius: var(--input-radius);
		border-bottom-right-radius: var(--input-radius);
		padding: var(--size-2);
		border: var(--input-border-width) solid var(--input-border-color);
	}

	.calendar.svelte-16sct4k:hover {
		background: var(--button-secondary-background-fill-hover);
		box-shadow: var(--button-primary-shadow-hover);
	}

	.calendar.svelte-16sct4k:active {
		box-shadow: var(--button-primary-shadow-active);
	}
