/* style.css */

/* General Styles */
body {
	font-family: Arial, sans-serif;
	margin: 20px;
}

h2, h3 {
	color: #333;
}

hr {
	border: none;
	height: 5px;
	background-color: blue;
	width: 100%;
	margin: 20px auto;
	opacity: 1.0;
}

/* Button Styles */
button {
	padding: 10px 20px;
	font-size: 16px;
	background-color: #4CAF50; /* Green */
	color: white;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	margin-top: 10px;
}

button:hover {
	background-color: #45a049; /* Darker green on hover */
}

/* Table Styles for DataTables integration */
.file1-column {
	background-color: #e0f7fa; /* Light blue for File 1 */
}

.file2-column {
	background-color: #ffe0b2; /* Light orange for File 2 */
}

/* DataTables adjustments */
table.display {
	width: 100%;
	border-collapse: collapse;
}

input[type="file"] {
	width: 500px; /* Set width as needed */
	font-size: 14px; /* Adjust font size if necessary */
}

.file-size {
	font-size: 14px;
}

/* Auto Match Controls Styling */
#autoMatchControls {
	width: 100%; /* Adjust container width as needed */
	margin-bottom: 20px; /* Add spacing below */
}

#autoMatchControls label {
	margin-right: 10px; /* Space between label and dropdown */
}

#autoMatchControls select {
	width: auto; /* Set dropdown width */
	font-size: 16px; /* Set dropdown font size */
	padding: 5px; /* Add padding for a larger click area */
}

/* Manual Match Controls Styling */
#manualMatchControls {
	width: 100%; /* Adjust container width as needed */
	margin-bottom: 20px; /* Add spacing below */
}

#manualMatchControls label {
	margin-right: 10px; /* Space between label and dropdown */
}

#manualMatchControls select {
	width: auto; /* Set dropdown width */
	font-size: 16px; /* Set dropdown font size */
	padding: 5px; /* Add padding for a larger click area */
}