.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); }
}
.rule-alert {
	background-color: #f8d7da;
	color: #721c24;
	padding: 10px;
	border-radius: 5px;
}
.tab-content {
	min-height: 400px;
}
.btn-generate {
	background-color: #0d6efd;
	color: white;
}
body, html {
	background-color: #ecf0f1;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
}
.bg-brown {
	background-color:#8B4513;
}
.bg-pink {
	background-color:pink;
}
.bg-indigo {
	background-color:indigo;
}
.table-row {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.5s ease, transform 0.5s ease;
}
.table-row.visible {
	opacity: 1;
	transform: translateY(0);
}
.tox-promotion {display:none;}
.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); }
}
@media (min-width: 576px) {
	.sidebar {
		font-size: 1.1rem;
		width: 300px;
		position: fixed; /* Keep sidebar in place */
		height: 100vh;
		min-height: 100%; /* Full height */
		top: 0;
		left: 0;
		padding: 30px 0px;
	}
	main {
		background-color: #ffffff;
		width: calc(100% - 300px); /* Subtract sidebar width */
		margin-left: 300px; /* Align with sidebar */
		padding-bottom: 30px;
		height:100%;
		min-height: 100vh;
	}
}
@media (max-width: 575px) {
	.sidebar {
		display: none;
	}
	main {
		background-color: #ffffff;
		width: 100%; /* Subtract sidebar width */
		padding-bottom: 30px;
		height:100%;
		min-height: 100vh;
	}
}