body, html {
	background-color: #f9fafb;
}
.intl-tel-input {width: 100%;}
.iti {width: 100%;}
.my-indicator{display:none;}
.htmx-request .my-indicator{display:inline;}
.htmx-request.my-indicator{display:inline;}
.spinner {
	display: inline-block;
	animation: spin 1s linear infinite;
}
@keyframes spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}
:root {
	--bs-primary: #4f46e5;
	--bs-primary-rgb: 79, 70, 229;
}

.btn-primary {
	background-color: #4f46e5;
	border-color: #4f46e5;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
	background-color: #4338ca; /* slightly darker for hover states */
	border-color: #4338ca;
}

.text-primary {
	color: #4f46e5 !important;
}

.bg-primary {
	background-color: #4f46e5 !important;
}

.border-primary {
	border-color: #4f46e5 !important;
}

/* Links, focus states, etc. */
a {
	color: #4f46e5;
}

a:hover {
	color: #4338ca;
}

/* Forms */
.form-check-input:checked {
	background-color: #4f46e5;
	border-color: #4f46e5;
}
.hover {
	transition: all 0.3s ease;
}

.hover:hover {
	transform: translate(-1px, -2px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}