// button {
// 	cursor: pointer;

// 	&[type="1"] {
// 		background: rgba(255, 255, 255, 0.2);
// 		border: none;
// 		color: white;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		backdrop-filter: blur(10px);
// 		&:active {
// 			background: rgba(255, 255, 255, 0.3);
// 			backdrop-filter: blur(5px);
// 		}
// 	}

// 	&[type="2"] {
// 		border: none;
// 		color: white;
// 		background: black;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
// 		box-shadow: 0 0 20px rgba(0, 255, 255, 0.75);
// 		&:active {
// 			box-shadow: 0 0 30px rgba(0, 255, 255, 1);
// 		}
// 	}

// 	&[type="3"] {
// 		background-color: #f0f0f0;
// 		border: none;
// 		color: black;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		box-shadow: 0 5px #666;
// 		transition: all 0.3s;
// 		&:active {
// 			box-shadow: 0 2px #666;
// 			transform: translateY(4px);
// 		}
// 	}

// 	&[type="4"] {
// 		background-color: #f0f0f0;
// 		border: none;
// 		color: black;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		box-shadow: 0 10px 15px rgba(0, 0, 0, 0.3);
// 		&:active {
// 			box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
// 		}
// 	}

// 	&[type="5"] {
// 		background-image: linear-gradient(to right, #f06, #48f);
// 		border: none;
// 		color: white;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		transition: background 0.3s;
// 		&:active {
// 			background-image: linear-gradient(to right, #48f, #f06);
// 		} 
// 	}

// 	&[type="6"] {
// 		background-color: #007bff;
// 		border: none;
// 		color: white;
// 		padding: 10px 20px;
// 		border-radius: 50px;
// 		&:active {
// 			background-color: #0056b3;
// 		}
// 	}

// 	&[type="7"] {
// 		background: transparent;
// 		border: 2px solid #007bff;
// 		color: #007bff;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		transition: background-color 0.3s, color 0.3s;
// 		&:active {
// 			background-color: #007bff;
// 			color: white;
// 		}
// 	}

// 	&[type="8"] {
// 		background-color: #f0f0f0;
// 		border: none;
// 		color: black;
// 		padding: 10px;
// 		border-radius: 5px;
// 		&:active {
// 			background-color: #e0e0e0;
// 		}
// 	}

// 	&[type="9"] {
// 		background-color: #f0f0f0;
// 		border: none;
// 		color: black;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		overflow: hidden;
// 		position: relative;
// 		&:after {
// 			content: '';
// 			position: absolute;
// 			top: 50%;
// 			left: 50%;
// 			width: 5px;
// 			height: 5px;
// 			background: rgba(0, 0, 0, 0.3);
// 			opacity: 0;
// 			border-radius: 100%;
// 			transform: scale(1, 1) translate(-50%);
// 			transform-origin: 50% 50%;
// 		}
// 		&:active:after {
// 			opacity: 1;
// 			transform: scale(150, 150) translate(-50%);
// 			transition: all 0.3s;
// 		}
// 	}

// 	&[type="10"] {
// 		background: url('/assets/texture.webp');
// 		border: none;
// 		color: white;
// 		padding: 10px 20px;
// 		border-radius: 5px;
// 		&:active {
// 			background-size: 110% 110%;
// 		}
// 	}

// }