/* Switch - Bootstrap 5 style form-switch */
.hourgate-switch {
	position: relative;
	display: inline-block;
	width: 2.25rem;
	height: 1.25rem;
	flex-shrink: 0;
}

.hourgate-switch input,
.hourgate-switch input:disabled {
	opacity: 0;
	width: 0;
	height: 0;
}

.hourgate-switch-slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--hourgate-border-color-strong, #ccc);
	transition: background-color 0.2s ease;
	border-radius: var(--hourgate-radius-pill, 34px);
	box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08);
}

.hourgate-switch-slider:before {
	position: absolute;
	content: "";
	height: 0.875rem;
	width: 0.875rem;
	left: 0.1875rem;
	bottom: 0.1875rem;
	background-color: #fff;
	transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.25);
}

input:checked + .hourgate-switch-slider {
	background-color: var(--hourgate-primary-color);
}

input:focus-visible + .hourgate-switch-slider {
	box-shadow: var(--hourgate-focus-ring, 0 0 0 3px rgba(79, 70, 229, 0.15));
}

input:checked + .hourgate-switch-slider:before {
	transform: translateX(1rem);
}

.hourgate-switch-slider.disabled {
	cursor: not-allowed;
	opacity: 0.5;
}