body {
	font-family: 'Noto Sans Thai', sans-serif;
	background-color: #f0f2f5;
	color: #333;
}
/* Custom styles for hamburger menu icon */
.hamburger-menu span {
	display: block;
	width: 25px;
	height: 3px;
	background-color: #333;
	margin: 5px 0;
	transition: 0.4s;
}
.hamburger-menu.active span:nth-child(1) {
	transform: rotate(-45deg) translate(-5px, 6px);
}
.hamburger-menu.active span:nth-child(2) {
	opacity: 0;
}
.hamburger-menu.active span:nth-child(3) {
	transform: rotate(45deg) translate(-5px, -6px);
}
/* Custom button styles for a nicer look */
.btn-primary {
	/* Changed from bg-blue-600 to bg-blue-700 and hover:bg-blue-700 to hover:bg-blue-800 */
	@apply bg-blue-700 hover:bg-blue-800 text-white font-bold py-2 px-4 rounded-full shadow-lg transition duration-300 ease-in-out transform hover:scale-105 flex items-center justify-center; /* Added flex for icon alignment */
}
.btn-secondary {
	/* Changed from bg-gray-200 to bg-gray-300 and hover:bg-gray-300 to hover:bg-gray-400 */
	@apply bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded-full shadow-md transition duration-300 ease-in-out transform hover:scale-105 flex items-center justify-center; /* Added flex for icon alignment */
}
/* Spacing for icons */
.btn-primary i, .btn-secondary i {
	margin-right: 8px; /* Space between icon and text */
}