/*
Theme Name: SmartMag Child
Theme URI: https://smartmag.theme-sphere.com/
Description: A child theme of SmartMag
Author: ThemeSphere
Author URI: https://theme-sphere.com
Template: smart-mag
Version: 1.1
*/

		.container {
			max-width: 800px;
			margin: 0 auto;
			padding: 20px;
		}

		h1 {
			text-align: center;
		}

		form {
			background-color: #fff;
			padding: 20px;
			border-radius: 10px;
			box-shadow: 0 0 10px rgba(0,0,0,0.1);
			display: flex;
			flex-direction: column;
			align-items: center;
		}

		label {
			display: block;
			margin-bottom: 10px;
			font-weight: bold;
		}

		input[type="number"] {
			display: block;
			padding: 10px;
			font-size: 16px;
			border-radius: 5px;
			border: 1px solid #ccc;
			margin-bottom: 20px;
			width: 100%;
			box-sizing: border-box;
			text-align: center;
		}

		input[type="number"]::placeholder {
			text-align: center;
		}

		button[type="submit"] {
			background-color: #4CAF50;
			color: #fff;
			padding: 10px 20px;
			border: none;
			border-radius: 5px;
			font-size: 16px;
			cursor: pointer;
			transition: background-color 0.3s ease;
			align-self: center;
		}

		button[type="submit"]:hover {
			background-color: #3e8e41;
		}

		#result {
			margin-top: 20px;
			padding: 20px;
			background-color: #fff;
			border-radius: 10px;
			box-shadow: 0 0 10px rgba(0,0,0,0.1);
			display: none;
		}

		#previousCalculations {
			margin-top: 20px;
			padding: 20px;
			background-color: #fff;
			border-radius: 10px;
			box-shadow: 0 0 10px rgba(0,0,0,0.1);
		}

		#previousCalculations h3 {
			margin-top: 0;
		}

		#previousCalculations ul {
			list-style: none;
			padding: 0;
			margin: 0;
		}

		#previousCalculations li {
			margin-bottom: 10px;
			font-size: 14px;
		}

		#previousCalculations li span {
			font-weight: bold;
		}

		.clear-button {
			background-color: #ccc;
			color: #fff;
			padding: 5px 10px;
			border: none;
			border-radius: 5px;
			font-size: 14px;
			cursor: pointer;
			transition: background-color 0.3s ease;
			margin-left: 10px;
		}

		.clear-button:hover {
			background-color: #999;
		}